JQ 之无缝整版滚动

(function($){
     $.fn.myScroll = function(options){
     //默认配置
     var defaults = {
          speed:40,  //滚动速度,值越大速度越慢
          rowHeight:24 //每行的高度
     };
    
     var opts = $.extend({}, defaults, options),intId = [];
    
     function marquee(obj, step){
    
          obj.find("ul").animate({
               marginTop: '-=1'
          },0,function(){
                    var s = Math.abs(parseInt($(this).css("margin-top")));
                    if(s >= step){
                         $(this).find("li").slice(0, 1).appendTo($(this));
                         $(this).css("margin-top", 0);
                    }
               });
          }
         
          this.each(function(i){
               var sh = opts["rowHeight"],speed = opts["speed"],_this = $(this);
               intId[i] = setInterval(function(){
                    if(_this.find("ul").height()<=_this.height()){
                         clearInterval(intId[i]);
                    }else{
                         marquee(_this, sh);
                    }
               }, speed);

               _this.hover(function(){
                    clearInterval(intId[i]);
               },function(){
                    intId[i] = setInterval(function(){
                         if(_this.find("ul").height()<=_this.height()){
                              clearInterval(intId[i]);
                         }else{
                              marquee(_this, sh);
                         }
                    }, speed);
               });
         
          });

     }

})(jQuery);

html 代码:

<style type="text/css">
		.list{height: 100px;}
		.list li{height: 50px;}
	</style>


<script type="text/javascript">
		$(document).ready(function(){
				$('.list li:even').addClass('lieven');
			})
			$(function(){
				$("div.list").myScroll({
					speed:30, //移动速度
					rowHeight:50 //li高度
				});
			});
	</script>


<div class="list">
			<ul>
				<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li>
			</ul>
		</div>

 特别注意一点:div的高度 height 值; 必须小于li的高度* li的数量
也就是说li的数量为5,li的height:25px;  那么 div的高度必须小于 5*25;