计算某DIV到顶部距离是否可能？

[liyoc]

如：
<header></header>
<div></div>
.
.
<div></div> /** 这些内容的高度不定! **/
<div id="fixed-bar"></div>

当滚动到fixed-bar时， fixed-bar就固定在顶部。
类京东 http://www.360buy.com/product/542126.html 滚动到“商品介绍栏”的位置，“商品介绍栏”会固定在顶部的效果


我的思路是，如果能计算fixed-bar到顶部距离，那么其他就好办了，怎么写呢？

如果无法计算该距离，那需要如何巧妙实现该功能呢，请教了

[liyoc]

当然我也有方法， 因为HTML是自己写的， 那么应该比较清楚哪些DIV的高度是会变化的，ok, 页面加载完就获取这些“变数”div的高度，然后加上其他不变div的高度，基本就是fixed-bar的scrolltop了。

我想大牛是否有更好的方法？

[CrazyDNet]

滚动条滚动的时候 判断下document.getElementById("fixed-bar").getBoundingClientRect().top是否等于0 如果等于0 就fixed在顶部

[jiashu912387]

如你所说 看京东的。
我觉得他应该是这样做的: js判断"fixed-bar" 有没有到达页面顶端。如果到达加上下面这段class
判断一个容器是否到达页面顶端可以网上搜搜
.nav-fixed {
position: fixed;
top: 0;
}

[Go 旅城通票]

window.onload的时候存储导航距离顶部的距离，滚动时判断是否到达导航条，参考：javascript滚动到导航条时如何固定导航条

[泡泡鱼_]

1:监听onscroll事件
2:获取对应的菜单的顶部偏移值，滚动到大于或等于此值时，非IE6直接[position: fixed]静止定位即可，IE6下需要额外实现
3:继续滚动时，以某一个指定对象做为参照，当滚动到大于或等于指定对象的顶部偏移值时，隐藏它

基本思路就是让它一个坐标区间内完成静止定位的功能

[hch126163]

function getAbsPoint(e)
{
var x = e.offsetLeft;
var y = e.offsetTop;
while(e = e.offsetParent)
{
x += e.offsetLeft;
y += e.offsetTop;
}
return {'x': x, 'y': y};
};

[liyoc]

document.getElementById("fixed-bar").getBoundingClientRect().top
牛啊，浏览器全兼容啊！
更多的一些解释： http://www.cnblogs.com/qieqing/archive/2008/10/06/1304399.html

[土豆吧]

引用 2 楼 CrazyDNet 的回复:

滚动条滚动的时候 判断下document.getElementById("fixed-bar").getBoundingClientRect().top是否等于0 如果等于0 就fixed在顶部

如果等于0 就固定在顶部, 那返回页面上边的时候,还会固定在顶部