js 实现无缝隙滚屏

页面代码

.scroll{
			overflow:hidden;
			position:relative;
		}
.scroll li{
			line-height:20px;
			position:absolute;
			
		}
		


<div class="scroll" style="height:240px;">
<ul>

<li style="top:0">1111111111111</li>
<li style="top:20px">22222222222</li>
<li style="top:40px">33333333333</li>
<li style="top:60px">44444444444</li>
<li style="top:80px">55555555555</li>
<li style="top:100px">66666666666</li>
						    	
</ul>
</div>

js代码

<script type="text/javascript">
        	$(function(){
        		var lis=$(".scroll li");
        		gun=setInterval(function() {
        			$.each(lis,function(index,li){
        			var list=$(li);
        			var height=parseFloat(list.css("lineHeight");
        			var top=parseFloat(list.css("top"));
        			list.css("top",top-1);
        			if(top<-height){
        				var bottom=(lis.length-1)*height;
        				list.css("top",bottom)
        			}
        		});
        		}, 50)
        		//停止滚动
        		var div=$(".scroll ul");
        		div.hover(function(){
        			clearInterval(gun)
        		},function(){
        			gun=setInterval(function() {
        			$.each(lis,function(index,li){
        			var list=$(li);
        			var height=parseFloat(list.css("lineHeight");
        			var top=parseFloat(list.css("top"));
        			list.css("top",top-1);
        			if(top<-height){
        				var bottom=(lis.length-1)*height;
        				list.css("top",bottom)
        			}
        		});
        		}, 50)
        		});
        	});