jQuery實(shí)現(xiàn)頁(yè)面滾動(dòng)時(shí)動(dòng)態(tài)加載內(nèi)容的方法
更新時(shí)間：2015年03月20日 10:45:07 作者：令狐不聰
這篇文章主要介紹了jQuery實(shí)現(xiàn)頁(yè)面滾動(dòng)時(shí)動(dòng)態(tài)加載內(nèi)容的方法,實(shí)例分析了jQuery實(shí)現(xiàn)動(dòng)態(tài)加載頁(yè)面的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了jQuery實(shí)現(xiàn)頁(yè)面滾動(dòng)時(shí)動(dòng)態(tài)加載內(nèi)容的方法。分享給大家供大家參考。具體分析如下：
很多網(wǎng)站，比如twitter，京東商城首頁(yè)，會(huì)在頁(yè)面滾動(dòng)到一定的位置時(shí)才動(dòng)態(tài)加載頁(yè)面內(nèi)容，這樣可以加快頁(yè)面打開(kāi)的速度，也可以節(jié)約帶寬，下面的JS代碼就可以幫你做到。
var loading = false;
$(window).scroll(function(){
if((($(window).scrollTop()+$(window).height())+250)>=$(document).height()){
if(loading == false){
loading = true;
$('#loadingbar').css("display","block");
$.get("load.php?start="+$('#loaded_max').val(), function(loaded){
$('body').append(loaded);
$('#loaded_max').val(parseInt($('#loaded_max').val())+50);
$('#loadingbar').css("display","none");
loading = false;
});
}
}
});
$(document).ready(function() {
$('#loaded_max').val(50);
});
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- 使用PHP+AJAX讓W(xué)ordPress動(dòng)態(tài)加載文章的教程
- PHP通過(guò)反射動(dòng)態(tài)加載第三方類(lèi)和獲得類(lèi)源碼的實(shí)例
- php+ajax實(shí)現(xiàn)無(wú)刷新動(dòng)態(tài)加載數(shù)據(jù)技術(shù)
- JQuery頁(yè)面隨滾動(dòng)條動(dòng)態(tài)加載效果的簡(jiǎn)單實(shí)現(xiàn)(推薦)
- js/jquery控制頁(yè)面動(dòng)態(tài)加載數(shù)據(jù) 滑動(dòng)滾動(dòng)條自動(dòng)加載事件的方法
- PHP實(shí)現(xiàn)簡(jiǎn)單ajax Loading加載功能示例
- php+ajax+jquery實(shí)現(xiàn)點(diǎn)擊加載更多內(nèi)容
- jQuery+PHP+ajax實(shí)現(xiàn)微博加載更多內(nèi)容列表功能
- PHP+jQuery實(shí)現(xiàn)滾屏無(wú)刷新動(dòng)態(tài)加載數(shù)據(jù)功能詳解
相關(guān)文章
本篇文章主要介紹了jQuery導(dǎo)航條固定定位效果實(shí)例代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要介紹了jQuery仿京東商城樓梯式導(dǎo)航定位菜單的相關(guān)資料，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-07-07
基本選擇器：是jQuery中使用最頻繁的選擇器，它由元素Id、Class、元素名、多個(gè)選擇符組成，通過(guò)基本選擇器可以實(shí)現(xiàn)大多數(shù)頁(yè)面元素的查找，感興趣的朋友可以參考下哈2013-04-04
jquery獲取當(dāng)前元素索引值用法實(shí)例
這篇文章主要介紹了jquery獲取當(dāng)前元素索引值用法,實(shí)例分析了jQuery獲取當(dāng)前元素索引在創(chuàng)建圖片輪播效果中的使用技巧,需要的朋友可以參考下2015-06-06
這篇文章主要介紹了Jquery獲取和修改img的src值,需要的朋友可以參考下2014-02-02
基于jquery實(shí)現(xiàn)的移入頁(yè)面上空文本框時(shí)，讓它變?yōu)榻裹c(diǎn)，移出清除焦點(diǎn)
基于jquery實(shí)現(xiàn)的移入頁(yè)面上空文本框時(shí)，讓它變?yōu)榻裹c(diǎn)，移出清除焦點(diǎn)的實(shí)現(xiàn)代碼。2011-07-07
jQuery獲得包含margin的outerWidth和outerHeight的方法
這篇文章主要介紹了jQuery獲得包含margin的outerWidth和outerHeight的方法,涉及jQuery中outerWidth及outerHeight方法的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03
jquery為我們提供了操作數(shù)組和對(duì)象的工具函數(shù)，方便和簡(jiǎn)化了我們對(duì)它們的操作。今天我們就進(jìn)入jQuery的工具函數(shù)的復(fù)習(xí)。2015-06-06
jQuery簡(jiǎn)單實(shí)現(xiàn)列表隱藏和顯示效果示例
這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)列表隱藏和顯示效果,結(jié)合實(shí)例形式分析了jQuery中slideToggle動(dòng)態(tài)操作頁(yè)面元素切換的相關(guān)技巧,需要的朋友可以參考下2016-09-09
jquery實(shí)現(xiàn)去除重復(fù)字符串的方法小結(jié)
這篇文章主要介紹了jquery實(shí)現(xiàn)去除重復(fù)字符串的方法,結(jié)合實(shí)例形式總結(jié)了三種常用的字符串去重操作技巧,需要的朋友可以參考下2016-04-04