<div id="demo" style="width: 480px; height: 105px; overflow: hidden;">
<div id="demo1" style="height:105px; float:left">
(这里是放了十张图片,不列出了)
</div>
<div id="demo2" style="height:105px; float:left">
</div> <script type="text/javascript" language="javascript">
var speed=20
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo1.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft=0
else
demo.scrollLeft++
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(MyMar)}
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
</script>
</div>
<div id="demo1" style="height:105px; float:left">
(这里是放了十张图片,不列出了)
</div>
<div id="demo2" style="height:105px; float:left">
</div> <script type="text/javascript" language="javascript">
var speed=20
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo1.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft=0
else
demo.scrollLeft++
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(MyMar)}
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
</script>
</div>
demo.scrollLeft=0
之后就进死循环了
demo.scrollLeft=0这个动作一直在执行
你的写法会出现一种情况,你的JS找不到demo。
原因是你的demo 这个DIV没有生成完。
建议吧JS写到完整的DIV外面<div id="demo" style="width: 480px; height: 105px; overflow: hidden;">
<div id="demo1" style="height:105px; float:left">
</div>
<div id="demo2" style="height:105px; float:left">
</div>
</div> <script type="text/javascript" language="javascript">
var speed=20
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo1.offsetWidth-demo.scrollLeft <=0)
demo.scrollLeft=0
else
demo.scrollLeft++
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(MyMar)}
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
</script>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 1</title>
</head><body>
<div id="demo" style="width: 480px; height: 405px; overflow: hidden;">
<div style=height:105px;width:2000 >
<div id="demo1" style="height:105px; float:left;">
<img
src="images/1.jpg"><img
src="images/2.jpg"><img
src="images/3.jpg"><img
src="images/4.jpg"><img
src="images/5.jpg"><img
src="images/6.jpg"><img
src="images/7.jpg"><img
src="images/8.jpg"><img
src="images/9.jpg"><img
src="images/10.jpg">
</div>
<div id="demo2" style="height:105px; float:left;">
</div>
</div> <script type="text/javascript" language="javascript">
var speed=2
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo1.offsetWidth-demo.scrollLeft <=0)
demo.scrollLeft=0
else
demo.scrollLeft++
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(MyMar)}
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)}
</script>
</div>
</body></html>