*{ padding: 0; margin: 0;}
li{ list-style: none;}
.wrapper{
width:220px;
height: 140px;
overflow: hidden;
position: relative;
margin: 40px auto;
border: 2px solid #ddd;
}
.wrapper .content{
height: 800px;
position: absolute;
top: 0;
}
.wrapper .content ul li{
margin-right:10px;
height: 100%;
}
img{
margin-top: 3px;
}
window.onload=function(){
var oWap=document.getElementById("wrapper");
var oCon=document.getElementById("con");
var oU=document.getElementById("ull");
var aList=oU.getElementsByTagName("li");
var len=aList.length;
oU.innerHTML+=oU.innerHTML;
var nowleft=0;
var timer;
oWap.onmouseover=function(){
clearInterval(timer);
}
oWap.onmouseout=function(){
move();
}
function move(){
clearInterval(timer);
timer=setInterval(function(){
nowleft-=3;
if(nowleft<-150*len){
nowleft=0;
}
oCon.style.top=nowleft+"px";
},10);
}
}
无缝连接滚动的原理改变包围图片的盒子的left的变化，利用js中setInterval()和clearInterval（）实现运动和停止的操作！
