1. 程式人生 > >js滾動到指定位置導航欄固定頂部

js滾動到指定位置導航欄固定頂部

window.onscroll=function(){
                 var topScroll =document.documentElement.scrollTop;//滾動的距離,距離頂部的距離
				 console.log(topScroll);
                 var bignav  = document.getElementById("bignav");//獲取到導航欄id
                 if(topScroll > 200){  //當滾動距離大於250px時執行下面的東西
				 console.log(1111);
                     bignav.style.position = 'fixed';
                     bignav.style.top = '0';
                     bignav.style.zIndex = '9999';
                 }else{//當滾動距離小於250的時候執行下面的內容,也就是讓導航欄恢復原狀
                     bignav.style.position = 'static';
                 }
             }

<div id="bignav" class="tabSelect">

.tabSelect{
	display: flex;
	justify-content: space-around;
	height: 50px;
	width: 100%;
	background-color: white;
	line-height: 50px;
	font-size: 16px;
	padding: 0 10px;
	margin-bottom: 6px;
	border-bottom: 1px solid #efeff4;
}