在获取当前鼠标坐标时因为参照物的不同,浏览器的兼容,导致在使用时总是觉得混乱,今天在看到一段总结整理下来,方便使用。
获得当前鼠标的坐标,根据参照物的不同,分为以下几套坐标系。
一套是以当前浏览器的可视区为参照物(clientX,clientY),另一套是以显示器的屏幕为参照物(screenX,screenY)。
此外微软还有一套坐标系(x,y),它是相对于触发事件的对象的offsetParent的。
火狐有另一套坐标系(pageX,pageY),它是相对于当前网页的。
1
var
getPosition
=
function
(e){
2 e = e || window.event;
3 var x = e.pageX || (e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));
4 var y = e.pageY || (e.clientY + (document.documentElement.scrollTop || document.body.scrollTop));
5 return { ' x ' :x, ' y ' :y};
6 }
2 e = e || window.event;
3 var x = e.pageX || (e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));
4 var y = e.pageY || (e.clientY + (document.documentElement.scrollTop || document.body.scrollTop));
5 return { ' x ' :x, ' y ' :y};
6 }
(clientX,clientY)的坐标系,不受滚动条影响