天天看點

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>      

繼續閱讀