在頁(yè)面滑動(dòng)到某一個(gè)位置時(shí),我們經(jīng)常需要顯示或隱藏一些div層等,這里需要用到滾動(dòng)事件,及獲取距離頂部的高度屬性, 這里寫一簡(jiǎn)單的示例,拋磚引玉
CSS內(nèi)容:
body{height: 3000px;} .top{ position: fixed; top:0; left:0; right:0; height: 50px; background-color: orange; min-width: 600px; max-width: 600px; margin:0 auto; } .body{ height: 460px; background-color: green; }
html標(biāo)簽:
<div class="top"></div> <div class="body"></div>
JS代碼:
$(function(){ $(document).scroll(function(){ //頁(yè)面滾動(dòng)時(shí)觸發(fā) let scrollTop = $(this).scrollTop(); //頁(yè)面滑動(dòng)距離頂部的高度 console.log(scrollTop); if(scrollTop > 460){ $(".top").css({"display":"none"}) } else{ $(".top").css({"display":"block"}) } }) })