如何使用jQuery找到元素px顶部的垂直距离

Question

如何使用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!

Answer 1

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

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

Answer 2

Rob W的答案是正确的 - 这将为您提供从整页顶部的偏移量.

如果要从可查看屏幕的顶部获取偏移量,则应执行以下操作:

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

希望有所帮助!