【JQ】无限滚动条

【JQ】无限滚动条
官网和下载地址：
当前版本1.51
使用实例：
最基本用法：
[javascript]view plaincopy?
1.$('#content').infinitescroll({ //#content是包含所有图或块的容器
2.navSelector : "div.navigation", //导航的容器，成功后会被隐藏
3.nextSelector : "div.navigation a:first", // 包含下一页链接的容器
4.itemSelector : "#content div.post" // 你将要取来的内容块
5.});
6.
7.<div id='content'>
8.<div class='post'>...</div>
9.......
10.</div>
11.<div class='navigation'><a href='p2.html'></a></div >//这里的链接页面名里要有个2才行，后面的页面名同位置换3、4...如p3.html
更多参数：
[javascript]view plaincopy?
1.$('#content').infinitescroll({
2.navSelector : "div.navigation", //导航的选择器，会被隐藏
3.nextSelector : "div.navigation a:first",//包含下一页链接的选择器
4.itemSelector : "#content div.post",//你将要取回的选项(内容块)
5.debug : true, //启用调试信息
6.loadingImg : "/img/loading.gif", //加载的时候显示的图片
7.//默认采用："loading.gif"
8.animate : true, //当有新数据加载进来的时候，页面是否有动画效果，默认没有
9.extraScrollPx: 50, //滚动条距离底部多少像素的时候开始加载，默认150
10.bufferPx : 40,//载入信息的显示时间，时间越大，载入信息显示时间越短
11.errorCallback: function(){},//当出错的时候，比如404页面的时候执行的函数
12.localMode : true //是否允许载入具有相同函数的页面，默认为false
13.},function(arrayOfNewElems){
14.//程序执行完的回调函数
15.});
16.
17.//取消绑定事件的函数写法：
18.$(window).unbind(‘.infscr’);
19.
20.//通过事件触发加载数据的写法：
21.$(document).trigger(‘retrieve.infscr’); //比如加到某个click事件中
22.
23.//此插件还可以载入任何页面的容器中的内容，可以是id以及是class，并转化到html存储，要比jquery自带的的load强大。

24.$('').load('/page/2/ #content div.post',function(){ $(thi s).appendT o('#content'); });
实例1：只要有页，就会一直加完为止
[javascript]view plaincopy?
1.$('#content').infinitescroll({
2.navSelector : '#pagenav',
3.nextSelector : '#pagenav a',
4.itemSelector : ".picdiv",
5.debug : false,
6.loadingImg : "ajax-loader.gif",
7.loadingText : "Loading new posts...",
8.animate : false,
9.donetext : "I think we've hit the end, Jim"
10.},function(){});
11.
12.<div id='content'>
13.<div class='picdiv'>...</div>
14.......
15.</div>
16.
17.<span id="pagenav" style="display:none" > <a href=" index.php?page=2&show=">Next</a></span>
实例2：加到10页就不再加
[javascript]view plaincopy?
1.var sp = 1
2.$(".infinite_scroll").infinitescroll({
3.navSelector: "#more",
4.nextSelector: "#more a",
5.itemSelector: ".item",
6.
7.loading:{
8.img: "images/masonry_loading_1.gif",
9.msgText: ' ',
10.finishedMsg: '木有了',
11.finished: function(){
12.sp++;
13.if(sp>=10){ //到第10页结束事件
14.$("#more").remove();
15.$("#infscr-loading").hide();
16.$("#page").show();
17.$(window).unbind('.infscr');
18.}
19.}
20.},errorCallback:function(){
21.$("#page").show();
22.}
23.},function(newElements){
24.var $newElems = $(newElements);
25.$newElems.fadeIn();
26.return;
27.});
28.<div class='infinite_scroll'>
29.<div class='item'>...</div>
30.......
31.</div>
32.<div id='more'><a href='p2.html'></a></div>
PS:被取用的那个页可以是个完整的包含调用内容块的网页，也可以只有被调用的内容块（连HTML和HEAD和BODY标签都没有）。