how to find the vertical distance from top in px of an element using jQuery

如何使用 javascript/jQuery 查找从页面顶部到 DOM 中元素所在位置的垂直距离？

我有点像

<ul>
<li>one</li>
<li>one</li>
<li>one</li>
<li>one</li>
<li class="test">one</li>
....
....
....
<li>one</li>
</ul>

例如，在这里，我想找到从页面顶部到 li#test元素的垂直距离。

我试过 .scrollTop()，但总是0！

102423 次浏览

小开

最佳答案

使用 .offset()获取元素与文档顶部之间的距离:

$("li.test").offset().top

小开

Rob W 的答案是正确的——这会给你整个页面顶部的偏移量。

如果你想得到可视屏幕顶部的偏移量，你应该这样做:

var viewableOffset = $("#li.test").offset().top - $(window).scrollTop();

希望能帮上忙！

小开

据我所知，.offset()得到当前滚动位置和文档顶部之间的距离。

你需要使用这个: $("li.test").position().top

小开

使用 $(element) . off () . top 并将页面上现有固定元素的高度添加到其中，以使其更加精确。