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 ....>이라고 된 부분을 삭제 하시고 확인!!
반응형
'javascript' 카테고리의 다른 글
| replaceAll 사용 방법 (0) | 2015.03.09 |
|---|---|
| javascript 인코딩 (0) | 2015.03.09 |
| 움직이는 레이어 (0) | 2015.03.09 |
| window.open 옵션 설명 (0) | 2015.03.05 |
| 자바스크립트 소스 및 유용한 자료 모음 (0) | 2015.03.04 |
