在頁面滑動到某一個位置時,我們經常需要顯示或隱藏一些div層等,這里需要用到滾動事件,及獲取距離頂部的高度屬性, 這里寫一簡單的示例,拋磚引玉
CSS內容:
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標簽:
<div class="top"></div> <div class="body"></div>
JS代碼:
$(function(){ $(document).scroll(function(){ //頁面滾動時觸發 let scrollTop = $(this).scrollTop(); //頁面滑動距離頂部的高度 console.log(scrollTop); if(scrollTop > 460){ $(".top").css({"display":"none"}) } else{ $(".top").css({"display":"block"}) } }) })