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

如：
<header></header> 
<div></div>
.
.
<div></div> /** 这些内容的高度不定! **/
<div id="fixed-bar"></div>当滚动到fixed-bar时， fixed-bar就固定在顶部。
类京东 http://www.360buy.com/product/542126.html 滚动到“商品介绍栏”的位置，“商品介绍栏”会固定在顶部的效果
我的思路是，如果能计算fixed-bar到顶部距离，那么其他就好办了，怎么写呢？如果无法计算该距离，那需要如何巧妙实现该功能呢，请教了

解决方案 »

  1.   

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

  2.   

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

  3.   

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

  4.   

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

  5.   

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

  6.   

     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};
    };
      

  7.   

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