div스크롤 계산해서 나오게 하는 스크립트

javascript

질주하는구 2015. 3. 9. 14:25

jquery사용 안할적의

내용 입니다.

style.left, style.top은 문서전체의 좌측상단을 기준으로 측정된 좌표값이고

event.clientX, event.clientY는 브라우저 클라이언트 영역의 좌측상단을 기준으로 측정된 좌표입니다.

스크롤이 되지 않은 상태에선 같은 값을 가지게 되지만,

스크롤이 된 상태라면 좌표값이 스크롤 된 양에 따라 달라집니다.

이를 일치시키려면 클라이언트 좌표에 스크롤 된 양을 더해서 계산에 포함시켜야 합니다.

document.getElementById(obj).style.left = event.clientX + document.body.scrollLeft + 'px';

document.getElementById(obj).style.top = event.clientY + document.body.scrollTop + 'px';

document.body.scrollLeft 및 document.body.scrollTop 가 스크롤을 움직여도 0으로 있을때

--> 소스 가장 위쪽에 <html> 보다 위에 <!DOCTYPE ....>이라고 된 부분을 삭제 하시고 확인!!