为什么这段js图片向上滚动的代码执行一遍会停?要具体点的!刚开始学

<style type="text/css">
#demo1 li{ width:160px; height:220px; float:left; margin:10px 0 10px 14px; _margin:10px 0 10px 10px;}
#demo1 li img{ border:1px solid #e0e0e0;}
#demo1 li p{text-align:center;}
#demo1 li p a,#demo1 li p a{ color:#000;}
</style>
</head>
<div id="demo1">
<div id=butong_net_top style="overflow:hidden;height:600;width:707;">
<div id=butong_net_top1>
<li>
<a href="cpjs.html"><img src="image/pic5.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电121212车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">搬运车</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">交流1吨</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic8.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨1212hgf垛车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic5.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电动堆垛车1</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic6.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">搬运车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">交流1吨2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic8.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电动堆垛车2</a></p>
</li>
</div>
<div id=butong_net_top2></div>
</div>
</div>
<script>
var speed=30 //这个是速度值越大速度越慢
butong_net_top2.innerHTML=butong_net_top1.innerHTML //克隆butong_net_top1为butong_net_top2
function Marquee1(){
//当滚动至butong_net_top1与butong_net_top2交界时
if(butong_net_top2.offsetTop-butong_net_top.scrollTop<=0)
butong_net_top.scrollTop-=butong_net_top1.offsetHeight //butong_net_top跳到最顶端
else{
butong_net_top.scrollTop++;
}
}
var MyMar1=setInterval(Marquee1,speed)//设置定时器
//鼠标移上时清除定时器达到滚动停止的目的
butong_net_top.onmouseover=function() {clearInterval(MyMar1)}
//鼠标移开时重设定时器
butong_net_top.onmouseout=function(){MyMar1=setInterval(Marquee1,speed)}
</script>

很简单的,因为
<div id=butong_net_top style="overflow:hidden;height:600;width:707;">
这里定义的层的高度为600px
而你DIV内面的内容过少,所以才会出现这样的问题,你把问题再多加一行,绝对不会有这样的问题的。
注意:butong_net_top1 必须比butong_net_top 要高

多一行代码如下:(绝对不会停下来)
<style type="text/css">
#demo1 li{ width:160px; height:220px; float:left; margin:10px 0 10px 14px; _margin:10px 0 10px 10px;}
#demo1 li img{ border:1px solid #e0e0e0;}
#demo1 li p{text-align:center;}
#demo1 li p a,#demo1 li p a{ color:#000;}
</style>
</head>
<div id="demo1">
<div id=butong_net_top style="overflow:hidden;height:600px;width:707px;">
<div id=butong_net_top1>
<li>
<a href="cpjs.html"><img src="image/pic5.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电121212车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">搬运车</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">交流1吨</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic8.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨1212hgf垛车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic5.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电动堆垛车1</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic6.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">搬运车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">交流1吨2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic8.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电动堆垛车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic5.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电121212车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">搬运车</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">交流1吨</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic8.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨1212hgf垛车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic5.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电动堆垛车1</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic6.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">搬运车2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic7.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">交流1吨2</a></p>
</li>
<li>
<a href="cpjs.html"><img src="image/pic8.gif" width="155" height="167" /></a>
<p><a href="cpjs.html">G系列1-2吨电动堆垛车2</a></p>
</li>
</div>
<div id=butong_net_top2></div>
</div>
</div>
<script>
var speed=10 //这个是速度值越大速度越慢
butong_net_top2.innerHTML=butong_net_top1.innerHTML //克隆butong_net_top1为butong_net_top2
function Marquee1(){
//当滚动至butong_net_top1与butong_net_top2交界时
if(butong_net_top2.offsetTop-butong_net_top.scrollTop<=0)
butong_net_top.scrollTop-=butong_net_top1.offsetHeight //butong_net_top跳到最顶端
else{
butong_net_top.scrollTop++;
}
}
var MyMar1=setInterval(Marquee1,speed)//设置定时器
//鼠标移上时清除定时器达到滚动停止的目的
butong_net_top.onmouseover=function() {clearInterval(MyMar1)}
//鼠标移开时重设定时器
butong_net_top.onmouseout=function(){MyMar1=setInterval(Marquee1,speed)}
</script>追问

我试过了不行 只是循环的时间比原来的长了一些 我想要的是不管内容的多少 他都会一直的循环!

追答


改为

(不是js代码有问题,而是你写的CSS样式有问题)

温馨提示:答案为网友推荐,仅供参考
相似回答