新浪微博有这个功能,刚才思考一下 ,简单的写了一下实现方法,代码是Js的.

无可否认,这种方式应该算是web2.0的产物,在用户体验上具备很好的感受,除了微博在使用该方式外,另外我还发现有几个其他性质的网站也在用这种方式,原因是他们的网站页面比较长,所以用户在浏览的时候随着滚动条的拖拽而不断加载新的内容到浏览器内,虽然体验会不错,但是我感觉这种方式对搜索引擎的友好性将会降低.欢迎转载但请注明出处Email:See7di@Gmail.com,Seven的部落格http://hi.baidu.com/see7di

所以除非不得已我是不会使用这种方式的,就目前来看我的作品内我还没发现哪个程序需要使用这种方式.

不过不论如何,创新就是一种进步,难道不是吗?

下边的代码是直接使用javascript来实现:
window.onscroll = function(){
var water = document.getElementById(“water”);
water.style.top = (document.documentElement.scrollTop|document.body.scrollTop)+’px’;
water.innerHTML = “scrollTop:” + (document.documentElement.scrollTop|document.body.scrollTop) + “
ClientHeight:” + document.documentElement.clientHeight + “
scrollHeight:” + document.documentElement.scrollHeight;

//滚动条在最底端的时候
if (document.documentElement.scrollHeight == (document.documentElement.scrollTop|document.body.scrollTop)+document.documentElement.clientHeight) {
//到最底端去请求新数据
var table=I.$(‘tag’,’table’)[0];
var start=parseInt(table.rows[table.rows.length-1].cells[0].innerHTML)+1;;
var length=10;
var param=’start=’+start+’&length=’+length;
I.AJAX.post(‘/test2/DataServlet’,param,function(o){
var persons=I.AJAX.json(o.responseText);
//加载新的十行数据
for(var i=0;ih’)},function(msg){//用ajax即时获取伺服器上的资料
if(msg.length>0){
$(“#index #tab5 #tab19”).last().after(msg);
ia=null;
}else{
$(“#index #div2”).last().remove();
$(“#index #tab5 #tab19”).last().after(‘Error:没有搜寻到任何结果,请尝试更换搜寻条件!‘);
}
});
}
}
});

原文地址:http://hi.baidu.com/see7di/blog/item/e1a7a5000b8ed495e850cd4a.html

随机文章

IOS版One Today上线
IOS版One Today上线

j2se java编写简易聊天室程序
j2se java编写简易聊天室程序

邮件搬家:转移旧邮箱邮件至新邮箱
邮件搬家:转移旧邮箱邮件至新邮箱

文章url别名对谷歌seo有利的新发现
文章url别名对谷歌seo有利的新发现

wordpress上传图片失败解决方案
wordpress上传图片失败解决方案

自2010起百度在移动方面上涨1000%
自2010起百度在移动方面上涨1000%

相关文章

jQuery网格插件ParamQuery
jQuery网格插件ParamQuery

AngularJS加载方式和angular.bootstrap
AngularJS加载方式和angular.bootstrap

jQuery boxy弹出层插件简介
jQuery boxy弹出层插件简介

分享jquery仿apple官网伸缩弹性搜索框
分享jquery仿apple官网伸缩弹性搜索框

内容分享:道招
本文链接:[转载]JQuery实现页面随滚动条滚动而动态加载内容的效果
道招声明:除特别标注或作者不详外,本站所有文章均为原创,转载请注明。欢迎共同关注互联网!