item上下自动循环滚动显示

 1 //li 上下滚动
 2 (function($){
 3     $.fn.extend({
 4         Scroll:function(opt,callback){
 5                 //参数初始化
 6                 if(!opt) var opt={};
 7                 var _btnUp = $("#"+ opt.up);//Shawphy:向上按钮
 8                 var _btnDown = $("#"+ opt.down);//Shawphy:向下按钮
 9                 var timerID;
10                 var _this=this.eq(0).find("ul:first");
11                 var     lineH=_this.find("li:first").height(), //获取行高
12                         line=opt.line?parseInt(opt.line,10):parseInt(this.height()/lineH,10), //每次滚动的行数，默认为一屏，即父容器高度
13                         speed=opt.speed?parseInt(opt.speed,10):5000; //卷动速度，数值越大，速度越慢（毫秒）
14                         timer=opt.timer //?parseInt(opt.timer,10):3000; //滚动的时间间隔（毫秒）
15                 if(line==0) line=1;
16                 var upHeight=0-line*lineH;
17                 //滚动函数
18                 var scrollUp=function(){
19                         _btnUp.unbind("click",scrollUp); //Shawphy:取消向上按钮的函数绑定
20                         _this.animate({
21                                 paddingTop:upHeight
22                         },speed,function(){
23                                 for(i=1;i<=line;i++){
24                                         _this.find("li:first").appendTo(_this);
25                                 }
26                                 console.info(_this.find("li:first"))
27                                 _this.css({marginTop:0});
28                                 _btnUp.bind("click",scrollUp); //Shawphy:绑定向上按钮的点击事件
29                         });
30 
31                 }
32                 //Shawphy:向下翻页函数
33                 var scrollDown=function(){
34                         _btnDown.unbind("click",scrollDown);
35                         for(i=1;i<=line;i++){
36                                 _this.find("li:last").show().prependTo(_this);
37                         }
38                         _this.css({marginTop:upHeight});
39                         _this.animate({
40                                 marginTop:0
41                         },speed,function(){
42                                 _btnDown.bind("click",scrollDown);
43                         });
44                 }
45                //Shawphy:自动播放
46                 var autoPlay = function(){
47                         if(timer)timerID = window.setInterval(scrollUp,timer);
48                 };
49                 var autoStop = function(){
50                         if(timer)window.clearInterval(timerID);
51                 };
52                  //鼠标事件绑定
53                 _this.hover(autoStop,autoPlay).mouseout();
54                 _btnUp.css("cursor","pointer").click( scrollUp ).hover(autoStop,autoPlay);//Shawphy:向上向下鼠标事件绑定
55                 _btnDown.css("cursor","pointer").click( scrollDown ).hover(autoStop,autoPlay);
56 
57         }       
58     })
59 })(jQuery);

1 $("#leaderboardList").Scroll({line:1,speed:3000,timer:3000});

1 <div id="leaderboardList">
2     <ul id="leaderboardList_item">
3         <!-- <li>
4             <span class="name">名字名字名字1</span>
5             <span class="good_name">产品</span>
6         </li> -->
7     </ul>
8 </div>