在網(wǎng)頁(yè)開(kāi)發(fā)中,經(jīng)常需要對(duì)頁(yè)面的滾動(dòng)進(jìn)行控制,而jQuery是一個(gè)非常常用的JavaScript庫(kù),它提供了豐富的滾動(dòng)控制方法。在這篇文章中,我們將簡(jiǎn)單介紹如何使用jQuery設(shè)置每次滾動(dòng)高度。
//首先要獲取到滾動(dòng)條當(dāng)前的高度值 var scrollTop = $(window).scrollTop(); //然后設(shè)置滾動(dòng)條的高度為我們想要的高度值 $(window).scrollTop(scrollTop + 200); //表示每次滾動(dòng)高度為200像素 //如果希望滾動(dòng)動(dòng)畫(huà)更平滑,則可以使用animate方法 $(window).animate({scrollTop: scrollTop + 200}, 500); //500是動(dòng)畫(huà)時(shí)間
上述代碼中,我們首先使用$(window).scrollTop()方法獲取當(dāng)前的滾動(dòng)高度值,并將其賦值給變量scrollTop。然后,我們使用$(window).scrollTop()方法設(shè)置滾動(dòng)高度為當(dāng)前高度加上我們想要的每次滾動(dòng)高度,這里我們?cè)O(shè)置了每次滾動(dòng)高度為200像素。
如果希望滾動(dòng)效果更平滑,可以使用animate方法,該方法會(huì)將滾動(dòng)條緩慢移動(dòng)到指定位置,接受兩個(gè)參數(shù),第一個(gè)參數(shù)是一個(gè)對(duì)象,用于設(shè)置要?jiǎng)赢?huà)的CSS屬性和值,這里我們只設(shè)置scrollTop屬性;第二個(gè)參數(shù)是動(dòng)畫(huà)時(shí)間,單位是毫秒。
使用jQuery控制頁(yè)面滾動(dòng)非常方便,本文介紹的方法只是其中一種,大家可以根據(jù)自己的實(shí)際需要選擇合適的方法。