jquery滾動條操作

2021-09-25 00:12:57 字數 896 閱讀 8982

在開發專案時,常常需要展示大量資料。如果全部顯示出來,資料相對少時,看不出來什麼不同,如果資料很多時,一次請求全部顯示,這就相當可怕了。

面對這種問題,pc裡使用了分頁效果,將資料分成一頁頁,換頁時請求當前頁資料,

而螢幕較小的移動端,分頁就不怎麼好看了,常用的方法是滾動到底部時繼續載入資料

滾動載入其實也是一種分頁,只是不使用頁碼而已。

(一)、滾動事件的效果和原理

原理: 3個資料(滾動視窗高度,滾動內容總高度, 當前已滾距離),

1個臨界(滾動內容總高度 = 當前已滾距離 + 滾動視窗高度)

1.獲取滾動視窗高度:(wi

ndow

).he

ight

();(

如果滾動

區域不是

整個頁面

,使

用(window).height();(如果滾動區域不是整個頁面,使用

(windo

w).h

eigh

t();

(如果滾

動區域不

是整個頁

面,使用

(『slector』).height())

2.獲取滾動內容總高度:$(this).get(0).scrollheight

3.當前已滾距離:$(this).scrolltop()

(二)、scroll滾動事件:$(selector).scroll(function() {})

複製**

function scrollfunc()

if(contenth - viewh - scrolltop <= 100)

if(scrolltop/(contenth -viewh) >= 0.95)

});

jQuery操作滾動條

一 窗體滾動條 1 獲取窗體滾動條當前縱向和橫向位置 var currenty document.body scrolltop 窗體滾動條縱向位置 var currentx document.body scrollleft 窗體滾動條橫向位置 2 設定窗體滾動條到指定位置 var y 想滾動到的垂直...

jquery 禁用 啟用滾動條

doctype html en btn div button value 禁用滾動條 onclick unscroll button value 啟用滾動條 onclick removeunscroll text div 文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本 文本...

jquery 禁用 啟用滾動條

doctype html html lang en head meta charset utf 8 meta name generator content editplus meta name author content meta name keywords content meta name d...