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