当前位置:  开发笔记 > 编程语言 > 正文

是否可以在浏览器视口中获取div的位置?不在文件中.在窗口内

如何解决《是否可以在浏览器视口中获取div的位置?不在文件中.在窗口内》经验,为你挑选了2个好方法。

这在IE7或Firefox中都可行吗?



1> Greg..:

您可以在两者中完成 - 获取相对于文档的位置,然后减去滚动位置.

var e = document.getElementById('xxx');
var offset = {x:0,y:0};
while (e)
{
    offset.x += e.offsetLeft;
    offset.y += e.offsetTop;
    e = e.offsetParent;
}

if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft))
{
    offset.x -= document.documentElement.scrollLeft;
    offset.y -= document.documentElement.scrollTop;
}
else if (document.body && (document.body.scrollTop || document.body.scrollLeft))
{
    offset.x -= document.body.scrollLeft;
    offset.y -= document.body.scrollTop;
}
else if (window.pageXOffset || window.pageYOffset)
{
    offset.x -= window.pageXOffset;
    offset.y -= window.pageYOffset;
}

alert(offset.x + '\n' + offset.y);


帽子......谁写了这个.

2> Himanshu P..:

[从我在这里给出的答案粘贴]

本机getBoundingClientRect()方法已经存在了很长一段时间,并且正是问题所要求的.此外,它支持所有浏览器(包括IE 5,似乎!)

从这个 MDN页:

返回的值是一个TextRectangle对象,它包含描述border-box的只读左,上,右和底属性,以像素为单位,左上角相对于视口的左上角.

你这样使用它:

var viewportOffset = el.getBoundingClientRect();
// these are relative to the viewport, i.e. the window
var top = viewportOffset.top;
var left = viewportOffset.left;

推荐阅读
mobiledu2402852413
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有