获取页面元素的位置

 

通常需要到获取页面元素相对窗口的位置：

 

function getObjPos(obj)

{

var x = 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};

}

获取鼠标位置：

function getCurPos(e)

{

e = e || window.event;

var D = document.documentElement || document.body;

if (e.pageX) return {x: e.pageX, y: e.pageY};

return {

x: e.clientX + D.scrollLeft - D.clientLeft,

y: e.clientY + D.scrollTop - D.clientTop

};

}

 event.pageX 和 event.pageY 来表示鼠标相对于文档的位置,MSIE 正好相反，它使用 event.clientX 和 event.clientY 表示鼠标相当于窗口的位置，而不是文档。所以需要添加 scrollLeft 和 scrollTop 这两个相对于文档的属性。MSIE 中文档并不是从 0，0 开始，而是通常有一个小的边框（通常是 2 象素），边框的大小定义在  document.body.clientLeft 和 clientTop 中，把这些减去。

obj.getBoundingClientRect()方法获取对象相对浏览器视窗的位置。返回对应的4个值。