来源http://isux.tencent.com/
查看网页源码,感觉以后可以用,就拷贝下来了做完参考:
<nav id="page-nav" style="display: none; ">
<a href="?action=page_more&page=1"></a>
</nav>
<div id="infscr-loading"><img alt="Loading..." src="http://isux.tencent.com/wp-content/uploads/2013/07/20130704115053640.gif"><span> </span></div>
<script>
/* 滚动加载 */
function page_more(){
var page=1;
var loading_flag=false;
function scrollListen(){
jQuery(document).scroll(function(){
var bottom_padding=jQuery(document).height()-jQuery(document).scrollTop()-jQuery(window).height();
if(bottom_padding<50 && !loading_flag){
loading_flag=true;
page_show();
page++;
}
});
}
function page_show(){
var _url="?action=page_more&page="+page
jQuery.ajax({
url: _url,type: 'GET',dataType: 'text', timeout: 20000,error: function(){ },
success:function(feedback){
loading_flag=false;
jQuery('#homecontent').append(feedback);
if(feedback.replace(/(^\s*)|(\s*$)/g, "")=="")jQuery("#infscr-loading").hide();
}
});
}
scrollListen();
}
jQuery(document).ready(function () {
page_more();
});