Question

我知道我可以使用jQuery .position()和.offset()，但我不知道为什么他们没有按照描述工作（相对于父母和相对于文档而言），分别）。

我有以下代码： ~~http://jsfiddle.net/ugxag1wg/1/~~ http://jsfiddle.net/ugxag1wg/3/

（与jsfiddle相同）：假设我有5个块，每个块高500px并使用以下代码：

$(".block").each(function(){
    dist = $(this).position();

    $(this).data("distance", dist.top );

    $(this).text( $(this).data("distance") );
})

如果我自己加载页面，它会很好用。但是，如果我在不在顶部位置时刷新它（或者用锚点加载到顶部下面的一个块），我将不会获得第一个块的0值。相反，它会对我看的地方不利。

例如，如果我将页面加载为新的，我应该分别获得0,500,1000,1500和2000的块，显示它们与父容器顶部的偏移量。但是，如果我将页面刷新一半（例如，在第二个块）或使用锚点加载到第二个块，我将获得-500,0,500,1000,1500。

我尝试了.position()和.offset()，但结果相同。所以，我想知道的是，如何在第一个示例中始终如一地获得结果，无论页面的加载位置如何？基本上，我只是想从顶部知道自己的位置他们的父容器。

感谢您的帮助！

编辑：我认为我发现了问题。我有另一个容器（100vh高度）包装块的父容器（请参阅更新的jsfiddle）。因此，当我滚动时，它是移动的父容器，但容器包装器没有。

所以，为什么使用.position()相对于.parent元素返回的位置没有，但似乎是相对于.parent-container元素？在这种情况下我该如何解决问题？

Answer 1

我认为你的问题是dist是你定义它的全局变量。改为var dist。你基本上每次都要覆盖它。：/

我也编辑了你的小提琴。请记住身体填充:) http://jsfiddle.net/ugxag1wg/2/

 html, body{

    padding: 0;
    margin: 0;        
 }

这应该有所帮助。

从顶部获取元素的位置

1 个答案: