日期:2014-05-16  浏览次数:20485 次

关于javascript的图片滚动。
我想做一个图片之间的切换滚动。当鼠标悬浮在数字上时,图片停下,鼠标离开数字时,继续隔3秒切换。但是鼠标离开数字后图片就越来越快的在切换。我设置的时间都是3秒。这个问题该怎么解决?求高手指点。
javascript代码如下:
//图片自动滚动
var now=1;
var next=6;
function show(d1)
{
if(Number(d1)){
clearTimeout(theTimer); //当触动按扭时,清除计时器
now=d1; //设当前显示图片
$("fig_"+now).style.bakcground="red";
}
for(var i=1;i<next;i++)
{
if(i==now)
{
$("dd_scroll").src="images/dd_scroll_"+i+".jpg";
}
}
if(now == next){ //设置下一个显示的图片
now = 1;
}
else{
now++;
}
}
function mouseout()//鼠标离开数字事件
{
setInterval('show()', 3000);
}
var theTimer=setInterval('show()', 3000); //设置定时器,显示下一张图片
window.onload=show; //页面加载时运行函数show()


这个是html代码:
<div class="mid">
  <div class="mid2" id="fig_1" onmouseover="show(1)" onMouseOut="mouseout()">1</div>
  <div class="mid2" id="fig_2" onmouseover="show(2)" onMouseOut="mouseout()">2</div>
  <div class="mid2" id="fig_3" onmouseover="show(3)" onMouseOut="mouseout()">3</div>
  <div class="mid2" id="fig_4" onmouseover="show(4)" onMouseOut="mouseout()">4</div>
  <div class="mid2" id="fig_5" onmouseover="show(5)" onMouseOut="mouseout()">5</div>
  <div class="mid2" id="fig_6" onmouseover="show(6)" onMouseOut="mouseout()">6</div>
  </div>

------解决方案--------------------
function mouseout()//鼠标离开数字事件{
theTimer = setInterval('show()', 3000);
}