在web開(kāi)發(fā)中，有時(shí)候我們需要實(shí)現(xiàn)一個(gè)特效，就是網(wǎng)頁(yè)的頂部在下滑的時(shí)候保持固定不動(dòng)，這種效果被稱為“頂部下滑不動(dòng)”效果，而jQuery正好提供了這樣的方法。

$(window).scroll(function(){
var scrollTop = $(window).scrollTop();
if(scrollTop >= 100){
$('#header').css({'position':'fixed', 'top':'0', 'width':'100%'});
}else{
$('#header').css({'position':'static', 'top':'auto', 'width':'auto'});
}
});

上面的代碼中，首先在頁(yè)面上引入jQuery庫(kù)，然后在window的scroll事件中獲取到滾動(dòng)條的高度，如果高度大于等于100px，則給header元素添加固定定位，同時(shí)設(shè)置它的寬度為100%。如果高度小于100px，則將header元素的定位設(shè)為默認(rèn)值（即static），同時(shí)將它的位置設(shè)置為auto。

使用jQuery來(lái)實(shí)現(xiàn)網(wǎng)頁(yè)頂部的下滑不動(dòng)效果非常簡(jiǎn)單，只需要在頁(yè)面中引入jQuery庫(kù)，然后添加一些簡(jiǎn)單的代碼就可以實(shí)現(xiàn)了。這種效果可以用于各種類型的網(wǎng)站，為用戶帶來(lái)更好的瀏覽體驗(yàn)。