javascript写的图片无缝滚动，向左滚动正常，向右滚动不正常(滚过去第一个就没了)，大家帮忙看下如何解决
代码如下：<scripttype="text/javascript">window.onload=function(){varroll=document.getEleme...
代码如下：
<script type="text/javascript">
window.onload=function (){
var roll=document.getElementById('roll');
var ul=roll.getElementsByTagName('ul')[0];
ul.innerHTML+=ul.innerHTML;
var li=ul.getElementsByTagName('li');
var left=document.getElementById('left');
var right=document.getElementById('right');
left.onclick=function (){
speed=-5;
}
right.onclick=function (){
speed=5;
}
ul.onmouseover=function(){
clearInterval(timer);
}
ul.onmouseout=function(){
timer=setInterval(function(){
ul.style.left=ul.offsetLeft+speed+'px';
if(ul.offsetLeft<-ul.offsetWidth/2){
ul.style.left='0px';
}else if(ul.offsetLeft>0){
ul.style.left=-ul.offsetWidth/2;
}
},20);
}
var speed=-5;
var timer=null;
ul.style.width=li[0].offsetWidth*(li.length+1)+'px';
timer=setInterval(function(){
ul.style.left=ul.offsetLeft+speed+'px';
if(ul.offsetLeft<-ul.offsetWidth/2){
ul.style.left='0px';
}
else if(ul.offsetLeft>=0){
ul.style.left=-ul.offsetWidth/2;
}
},20);
}
</script>
</head>
<body>
<div id="roll" class="roll">
<input id="left" value="left" />
<input id="right" value="right" />
<div class="warp">
<ul>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
</ul>
</div>
</div> 展开
<script type="text/javascript">
window.onload=function (){
var roll=document.getElementById('roll');
var ul=roll.getElementsByTagName('ul')[0];
ul.innerHTML+=ul.innerHTML;
var li=ul.getElementsByTagName('li');
var left=document.getElementById('left');
var right=document.getElementById('right');
left.onclick=function (){
speed=-5;
}
right.onclick=function (){
speed=5;
}
ul.onmouseover=function(){
clearInterval(timer);
}
ul.onmouseout=function(){
timer=setInterval(function(){
ul.style.left=ul.offsetLeft+speed+'px';
if(ul.offsetLeft<-ul.offsetWidth/2){
ul.style.left='0px';
}else if(ul.offsetLeft>0){
ul.style.left=-ul.offsetWidth/2;
}
},20);
}
var speed=-5;
var timer=null;
ul.style.width=li[0].offsetWidth*(li.length+1)+'px';
timer=setInterval(function(){
ul.style.left=ul.offsetLeft+speed+'px';
if(ul.offsetLeft<-ul.offsetWidth/2){
ul.style.left='0px';
}
else if(ul.offsetLeft>=0){
ul.style.left=-ul.offsetWidth/2;
}
},20);
}
</script>
</head>
<body>
<div id="roll" class="roll">
<input id="left" value="left" />
<input id="right" value="right" />
<div class="warp">
<ul>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
<li><图。。></li>
</ul>
</div>
</div> 展开
2个回答
展开全部
亲，你可以去搜智能社的javascript视频来看，讲解过程通俗易懂，也有无缝滚动这部分的内容
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
