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坐标了。