在做手機網站,為了更好的用戶使用,通常不會用到帶頁碼塊的分頁去做列表頁,以便在用戶點擊時不會去按特別小的頁碼去實現瀏覽每頁,所以這里用到了ajax實現的下拉加載更多的做法,接下來,就是講解如何去實現這個效果:
//在做之前建議先引入jquery框架庫
$(window).scroll(function () {
//第一步,通過jquery獲取windows對象,創建一個滾動事件
var scrollTop = $(this).scrollTop();
//第二步,$(this)指的就是當前window對象,
獲取window對象滾動條在Y軸上的滾動距離
var scrollHeight = $(document).height();
//第三步,獲取文檔對象的高度
var windowHeight = $(this).height();
//第四步,獲取window對象的高度
if (scrollTop + windowHeight == scrollHeight) {
從這個三個變量的介紹就可以看出來,滾動條到底部的條件即為scrollTop + clientHeight == scrollHeight。(兼容不同的瀏覽器)。
//此處是滾動條到底部時候觸發的事件,在這里寫要加載的數據,或者是拉動滾動條的操作,下一篇將講實例操作如何,請期待....
}
});上一篇: 織夢dedecms頁面出現亂碼的問題
下一篇: 網站列表頁的下拉底部實現加載更多的實例
關鍵詞:
