天天看点

jquery + css 实现div固定

当页面滚动条滚动到指定或大于 div 初始位置时,div 始终保持在页面顶部不动,滚动条小于初始位置时 div 还原

<script type="text/javascript">
   $(function () {
     var ie6 = document.all;
     var dv = $('#toolbar1'), st;
     dv.attr('otop', dv.offset().top); //存储原来的距离顶部的距离 
     $(window).scroll(function () {
       st = Math.max(document.body.scrollTop || document.documentElement.scrollTop);
       if (st > parseInt(dv.attr('otop'))) {
         if (ie6) {//IE6不支持fixed属性,所以只能靠设置position为absolute和top实现此效果 
           dv.css({ position: 'absolute', top: st });
         }
         else if (dv.css('position') != 'fixed') dv.css({ 'position': 'fixed', top: 0 ,'z-index':10000});
       } else if (dv.css('position') != 'static') dv.css({ 'position': 'static' });


       dv.html(st);
     });
   }); 
 </script>      

继续阅读