function getXY(obj){
var x = 0,y = 0;
if (obj.getBoundingClientRect) {
var box = obj.getBoundingClientRect();
var D = document.documentElement;
x = box.left + Math.max(D.scrollLeft, document.body.scrollLeft) - D.clientLeft;
y = box.top + Math.max(D.scrollTop, document.body.scrollTop) - D.clientTop
}
else{
for (; obj != document.body; x += obj.offsetLeft, y += obj.offsetTop, obj = obj.offsetParent) {}
}
return {
x: x,
y: y
}
}
页面滚动偏移量的计算在不同浏览器下有所不同,不过我们可以借鉴YUI里面方法,设计一个通用的方式:
scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
在W3C标准下document.body.scrollTop和document.body.scrollLeft都为0,所以采用了上面兼容的方式获取页面滚动条的偏移量。
将ClientRect对象的left、top属性分别加上scrollLeft和scrollTop,就能获取Dom元素的X/Y坐标了。