jQuery 用jquery获取固定div的位置
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9527783/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get the position of a fixed div with jquery
提问by m4rk
I have a div with position "fixed" and I want to get the value of its position relative to the whole documentwhile the user scrolls down the page.
我有一个位置“固定”的 div，我想在用户向下滚动页面时获取其相对于整个文档的位置值。
So, lets say I place the div on (x=0,y=0) and then the user scrolls down a bit and now, relative to the document, the div is on (X=0,y=300). I want to get that information, I want to know the exact position of that div in every moment, again, relative to the whole document, not to the window or the browser.
因此，假设我将 div 放在 (x=0,y=0) 上，然后用户向下滚动一点，现在，相对于文档，div 位于 (X=0,y=300) 上。我想获得这些信息，我想知道那个 div 在每一刻的确切位置，同样，相对于整个文档，而不是相对于窗口或浏览器。
I've tried many things but nothing seems to get what I'm trying to.
我尝试了很多东西，但似乎没有得到我想要的东西。
One of them is this code, which does not work in the case of a fixed div:
其中之一是这段代码，它在固定 div 的情况下不起作用：
var position = $("#fixed").offset(); /*it gets the position of the div
"fixed" relative to the document*/
$("#fixed").html(position.top); /*it prints the obtained
value on the div "fixed"*/
Here you can find the running code, and you can see that, when you scroll down, the value of the position of the div does not change.
在这里可以找到运行代码，可以看到，向下滚动时，div的位置值没有变化。
If I am not wrong, the code should print a new value on the div everytime it changes its vertical position relative to the document. But it turns out that it does not happen.
如果我没有弄错，代码应该在每次更改其相对于文档的垂直位置时在 div 上打印一个新值。但事实证明，这不会发生。
SOLVED:
解决了：
The question was solved by codef0rmer. I was missing to track the scrollingto refresh the value of the position of the fixed div. I was an idiot. So the final codeworks fine the way he wrote it:
该问题由codef0rmer解决。我缺少跟踪滚动以刷新固定 div 位置的值。我是个白痴。所以最终的代码按照他写的方式工作得很好：
$(function () {
var position = $("#fixed").offset();
$("#fixed").html(position.top);
$(window).scroll(function () {
var position = $("#fixed").offset();
$("#fixed").html(position.top);
});
})
And here you can see the running code.
Thank you everyone and specially to codef0rmer.
谢谢大家，特别感谢 codef0rmer。
采纳答案by codef0rmer
you can use .offset()to get the current coordinates of the element relative to the document whereas .position()to get the current coordinates of an element relative to its offset parent.
您可以使用.offset()获取元素相对于文档.position()的当前坐标，而获取元素相对于其偏移父元素的当前坐标。
回答by j08691
.offset()gives you the coordinates relative to the whole document.
.offset()为您提供相对于整个文档的坐标。
The .offset() method allows us to retrieve the current position of an element relative to the document. Contrast this with .position(), which retrieves the current position relative to the offset parent. When positioning a new element on top of an existing one for global manipulation (in particular, for implementing drag-and-drop), .offset() is the more useful.
.offset() returns an object containing the properties top and left.
Note: jQuery does not support getting the offset coordinates of hidden elements or accounting for borders, margins, or padding set on the body element.
.offset() 方法允许我们检索元素相对于文档的当前位置。将此与 .position() 进行对比，后者检索相对于偏移父级的当前位置。当将新元素放置在现有元素之上以进行全局操作（特别是实现拖放）时，.offset() 更有用。
.offset() 返回一个包含 top 和 left 属性的对象。
注意：jQuery 不支持获取隐藏元素的偏移坐标，也不支持在 body 元素上设置边框、边距或填充。
回答by Barry
Unless you refresh the page and the scrollbar is at a different position at the moment it initialize.
除非您刷新页面并且滚动条在初始化时处于不同的位置。
回答by Luciano Prevedello
($("div").offset().top - $(document).scrollTop())
