js实现无缝循环滚动
本文实例为大家分享了js无缝循环滚动实现代码，供大家参考，具体内容如下
1、图片格式：260*400.
2、使用循环定时器轻松实现
<!doctypehtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>无缝滚动</title>
</head>
<styletype="text/css">
.row{
width:1298px;
height:400px;
border:1pxsolid;
box-shadow:2px2px2px#000;
overflow:hidden;
}
.box{
position:relative;
}
.box1,.box2{
width:1298px;
position:absolute;
}
.box2{
left:1298px;
}
img{
float:left;
}
</style>
<body>
<divclass="row">
<divclass="box"id="box">
<divclass="box1"id="box1">
<imgsrc="images/1.jpg">
<imgsrc="images/2.jpg">
<imgsrc="images/3.jpg">
<imgsrc="images/4.jpg">
<imgsrc="images/5.jpg">
</div>
<divclass="box2"id="box2">
<imgsrc="images/1.jpg">
<imgsrc="images/2.jpg">
<imgsrc="images/3.jpg">
<imgsrc="images/4.jpg">
<imgsrc="images/5.jpg">
</div>
</div>
</div>
</body>
<scripttype="text/javascript">
window.onload=function(){
var_box1=document.getElementById("box1");
var_box2=document.getElementById("box2");
varx=0;
varfun=function(){
_box1.style.left=x+'px';
_box2.style.left=(x+1298)+'px';
x--;
if((x+1298)==0){
x=0;
}
}
setInterval(fun,1);
}
</script>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助。