div背景循环切换问题 背景可以切换了，怎样让鼠标移动到上面时背景停止切换，移开继续， 下面是代码

Question

html代码
<div class="nav" id="div" style=" background-image: url(img/navbgbg3.png);">

javascript代码
<script language="javascript" type="text/javascript">
var images_id= ["img/navbgbg3.png", "img/navbgbg5.png", "img/navbgbg1.png", "img/navbgbg2.png", "img/navbgbg1.png", "img/navbgbg4.png"];
var index = 0;
function switch_background(){
if(index ==images_id.length-1)
{
index = 0;
}else{
index++;
}
document.getElementById("div").style.backgroundImage="url("+images_id[index]+")";
}
window.onload = function()
{
setInterval(switch_background, 5000);

} </script>

Answer 1

        var images_id= ["img/navbgbg3.png", "img/navbgbg5.png", "img/navbgbg1.png", "img/navbgbg2.png", "img/navbgbg1.png", "img/navbgbg4.png"];
        var index = 0;
        var TerHander="";
        function switch_background()
        {    
            if(index ==images_id.length-1)
            {        
                 index = 0;  
            }else{   
                 index++;      
            }   
             document.getElementById("div").style.backgroundImage="url("+images_id[index]+")";
        }

        div.onmouseover = function(){
            clearInterval(TerHander);
        }
        div.onmouseout = function(){
             TerHander=setInterval(switch_background, 5000);
        }
        window.onload = function()
        {
            TerHander=setInterval(switch_background, 5000);
            
        }

追问

替换我原来的就不能切换背景了

追答

看看代码具体报错在哪里。。。。其实就是把定时器用一个变量保存起来。。。监听div的mouseover(移入)和mouseout（事件），分别清除定时器和从新设置定时器

Answer 2

我找不到你代码，只好告诉下你思路，

先定义一个timer变量来接受定时器返回值

var timer=window.setInterval('timer()',1000)


你可以写一个onmouseover事件。

然后在里面clearInterval(timer)；

这样就暂停了（其实是清除了），但是你之前保存动画进度的数据不会丢。

之后onmouseout在调用这个定时器方法（你一定用的面向对象吧）。

然后就OK了。