如何获得元素相对于浏览器窗口的最高位置?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (16)

我希望获得元素相对于浏览器窗口的位置(显示页面的视窗,而不是整个页面)。如何在JavaScript中实现这一点?

提问于
用户回答回答于

在我的情况下,为了避免滚动,我添加了窗口。滚动到等式中:

var element = document.getElementById('myElement');
var topPos = element.getBoundingClientRect().top + window.scrollY;
var leftPos = element.getBoundingClientRect().left + window.scrollX;

这允许我获得元素在文档中的真实相对位置,即使它已经被滚动。

用户回答回答于

MDN页面

返回的值是一个TextRectangle对象,其中包含只读左侧,顶部,右侧和底部属性,以像素为单位,左上角相对于视口的左上角

你这样使用它:

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

扫码关注云+社区