<!--css代码--> * {padding:0; margin:0;} .content{ margin:0 auto; width:700px; height:200px; background:pink; } #btn1,#btn2,#btn3,#btn4,#btn5,#btn6,#btn7{width:30px; height:10px; border:1px solid gray; float:left; position:relative; left:470px; margin-top:10px; margin-left:20px; }<!--HTML代码--><br/><br/><br/><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <link rel="stylesheet" type="text/css" href="files/1.css"> <script language="javascript"> var n=0; function player(){ document.getElementById("ss").src="files/"+((n++%7)+1)+"."+"png"; } var int=setInterval("player()",1500); function test(obj){ int=clearInterval(int); var num=parseInt(obj.id.substring(3,4)); document.getElementById("ss").src="files/"+num+"."+"png"; obj.style.background="blue"; } function out(obj){ obj.style.background="white"; var num=parseInt(obj.id.substring(3,4)); var int=setInterval("player()",1500); document.getElementById("ss").src="files/"+num+"."+"png"; } </script> </head> <body> <div class="content"><img src="files/1.png" width="700px" height="200px" id="ss"></div> <div id="btn1" onmouseover="test(this)" style="background:white;" onmouseout="out(this)" ></div><div id="btn2" onmouseover="test(this)" style="background:white;" onmouseout="out(this)" ></div><div id="btn3" onmouseover="test(this)" style="background:white;" onmouseout="out(this)"></div><div id="btn4" onmouseover="test(this)" style="background:white;" onmouseout="out(this)"></div><div id="btn5" onmouseover="test(this)" style="background:white;" onmouseout="out(this)"></div><div id="btn6" onmouseover="test(this)"style="background:white;" onmouseout="out(this)"></div><div id="btn7" onmouseover="test(this)" style="background:white;"onmouseout="out(this)"></div> </body> </html>
如上图所示啊,我想做一个放QQ音乐的图片滚播,我想鼠标放到div按钮上图片就显示相应的图片并且停止轮播,但是当鼠标离开div按钮然后在放到div按钮上,为什么图片一直滚动不停了,怎么样让他不要继续滚呢
你不听滚动因为缺少了这段代码
window.clearInterval(int);