[Javascript] 크로스브라우저로 이벤트 함수 내에서 마우스 포인터 위치 가져오기

* 마우스 포인터를 mousedown이나 mouseup, mousemove, click 등의 이벤트 콜백 함수 안에서 가져오고자 한다면 아래와 같은 함수를 호출하면 된다.

function mouseX(evt) {
if (evt.pageX) return evt.pageX;
else if (evt.clientX)
   return evt.clientX + (document.documentElement.scrollLeft ?
   document.documentElement.scrollLeft :
   document.body.scrollLeft);
else return null;
}

function mouseY(evt) {
if (evt.pageY) return evt.pageY;
else if (evt.clientY)
   return evt.clientY + (document.documentElement.scrollTop ?
   document.documentElement.scrollTop :
   document.body.scrollTop);
else return null;
}

* 이것을 이벤트 함수 자체에 넣거나 두개를 묶어서 리턴을 하는 방법도 있다. 리턴값의 .x와 .y로 접근하면 된다.

 

function onmousedown(evt) {
if (evt.pageX) return {x:evt.pageX , y:evt.pageY};
else if (evt.clientX)
   return {x:evt.clientX + (document.documentElement.scrollLeft ?
       document.documentElement.scrollLeft :
       document.body.scrollLeft) , 
       y:evt.clientY + (document.documentElement.scrollTop ?
       document.documentElement.scrollTop :
       document.body.scrollTop)};
else return null;
}

끝.