■ 프론트엔드 ■/JavaScript

clientX,Y - 현재화면의 마우스좌표 반환받기

serpiko 2013. 10. 13. 23:55

마우스로 클릭한 지점에 대한 x,y (left, top)에 대한 좌표는

 

1
2
3
$(".photo").click(function(e){
  alert(e.clientX, e.clientY);
 })

 

으로 알 수 있다.

 

참고로 스크롤이 되지 않은 상태이면 상관없지만 스크롤이 된 상태에서의 좌표값은

 

클라이언트 좌표에 스크롤된 amount를 합산해 주어야 한다.

 

1
2
  document.getElementById(obj).style.left = event.clientX + document.body.scrollLeft + 'px';
  document.getElementById(obj).style.top = event.clientY + document.body.scrollTop + 'px';