本文实例讲述了jQuery实现页面滚动时动态加载内容的方法。分享给大家供大家参考。具体分析如下:
很多网站,比如twitter,京东商城首页,会在页面滚动到一定的位置时才动态加载页面内容,这样可以加快页面打开的速度,也可以节约带宽,下面的JS代码就可以帮你做到。
?123456789101112131415161718 | 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); }); |
希望本文所述对大家的jQuery程序设计有所帮助。
新闻热点
疑难解答