滚动页面,固定头部

html:

<div class="bill">
    <div id="scrollHeader">
       <div class="scrolling">
         头部信息
       </div>
   </div>
    <div id="body">
          以下内容
     </div>
</div>

css:

.scrolling{position: relative;top: 0;left: 0;z-index: 1000;width: 100%;background: #FFFFFF;}

js:

window.onscroll  = function () {
    var t = document.documentElement.scrollTop || document.body.scrollTop;
    var height=document.getElementById("scrollHeader").offsetHeight;
    if (t > height){
        $(".scrolling").css("position","fixed");
        $(".bill_total").css("margin-top","1.12rem");
    }
    else{
        $(".scrolling").css("position","relative");
        $(".bill_total").css("margin-top",".0rem");
    }
};

猜你喜欢

转载自blog.csdn.net/yangmy_Shy/article/details/89177546