-_-! 鼠标悬停 图片不停止?

Question

var j=1, timerID = 0;
    function _start(){
        var divs = $("#ppt_image div");
        alert(divs[1]);//输出undefined
                alert(divs.length);//输出0
        timerID = setInterval("tupian()", 3500);
        for(var i=0; i<divs.length; i++){
            divs.onmouseover = function(){
                clearInterval(timerID);
            };
            divs.onmouseout = function(){
                timerID = setInterval("tupian()", 3500);
            };
        }
    }//以下可以正常执行图片可以自动跳转!    function tupian(){
        var img=$("#image"+j).attr("img");
        $("#button"+j).addClass("button"+j+"_3");
        $("#text"+j).fadeIn("slow");
        img="url('"+img+"')";
        $("#image"+j).css({background:img,"width":"500px","height":"230px"}).fadeIn("slow");                
        for(var i=1;i<=6;i++){
            if (j!=i){
                $("#button"+i).removeClass("button"+i+"_3");
                $("#image"+i).removeAttr("style");
                $("#text"+i).hide();
            }
        }
        j = j < 6 ? j + 1 : 1;
    }
    tupian();
    _start();
//图片可以自动跳转,但是鼠标悬停后图片仍然跳转!
//请高手帮忙解决!
//还有就是我做的这个幻灯片这浏览器打开后会加载很多效果! ie6会崩溃关闭 如何解决!
//求教

Answer 1

setInterval之前加一句 clearInterval试试看
divs.onmouseout = function(){
     if(timerID) clearInterval(timerID);
     timerID = setInterval("tupian()", 3500); 
}; 

Answer 2

1楼的你的方法我试了 没效果!    function _start(){
        var divs = $("#ppt_image div");
        alert(divs[1]);//输出undefined
                alert(divs.length);//输出0
        timerID = setInterval("tupian()", 3500);
        for(var i=0; i <divs.length; i++){
            divs.onmouseover = function(){
                clearInterval(timerID);
            };
            divs.onmouseout = function(){
                timerID = setInterval("tupian()", 3500);
            };
        }
    } 问题是出在这里 是不是我的代码写错了?

Answer 3

demo都不贴全。“alert(divs[1]);//输出undefined”还玩啥，事件都没赋值上。

Answer 4

另外，用了jquery框架？用得不纯哇。

Answer 5

jquery 还不是很熟! 在一点一点学习中!还需要粘什么?
这句写错了么var divs = $("#ppt_image div"); 请指教!<div id="ppt_image">
<div id="image1" class="image_pg1" img="./upload/ppt/ppt_1.jpg"></div>
<div id="image2" class="image_pg1" img="./upload/ppt/ppt_2.jpg"></div>
<div id="image3" class="image_pg1" img="./upload/ppt/ppt_3.jpg"></div>
<div id="image4" class="image_pg1" img="./upload/ppt/ppt_4.jpg"></div>
<div id="image5" class="image_pg1" img="./upload/ppt/ppt_5.jpg"></div>
<div id="image6" class="image_pg1" img="./upload/ppt/ppt_6.jpg"></div>
</div>

Answer 6

何必要用for循环，，，JQuery了还不each

Answer 7

var divs = $("#ppt_image div");应该没错，看看ID是否重名了

Answer 8

如果alert(divs[1])不为undefined了，，，那么没有加下标：        for(var i=0; i <divs.length; i++){
            divs[i].onmouseover = function(){
                clearInterval(timerID);
            };
            divs[i].onmouseout = function(){
                timerID = setInterval("tupian()", 3500);
            };
        } 

Answer 9

ID没有重名!
var divs= $("#ppt_image div");这句没有错那是哪里出问题了?    var j=1, timerID = 0;
    function _start(){
        var divs = $("#ppt_image div");
        timerID = setInterval("tupian()", 3500);
        for(var i=0; i<divs.length; i++){
            divs[i].onmouseover = function(){
                clearInterval(timerID);
            };
            divs[i].onmouseout = function(){
if(timerID) clearInterval(timerID); 
                timerID = setInterval("tupian()", 3500);
            };
        }
    }
//以下可以实现图片跳转
    function tupian(){
var img=$("#image"+j).attr("img");
$("#button"+j).addClass("button"+j+"_3");
$("#text"+j).fadeIn("slow");
img="url('"+img+"')";
$("#image"+j).css({background:img,"width":"500px","height":"230px"}).fadeIn("slow");
for(var i=1;i<=6;i++){
if (j!=i){
$("#button"+i).removeClass("button"+i+"_3");
$("#image"+i).removeAttr("style");
$("#text"+i).hide();
}
}
        j = j < 6 ? j + 1 : 1;
    }
    tupian();
    _start();

Answer 10

var divs = $("#ppt_image div");
alert(divs[1]);          //输出还是undefined
alert(divs.length);      //输出0如果var divs = $("#ppt_image div");没有写错 这是什么问题!
#ppt_image ID没有重名!

Answer 11

纯的jquery是这样写的。
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<div id="ppt_image">
<div id="image1" class="image_pg1">1</div>
<div id="image2" class="image_pg1">2</div>
<div id="image3" class="image_pg1">3</div>
<div id="image4" class="image_pg1">4</div>
<div id="image5" class="image_pg1">5</div>
<div id="image6" class="image_pg1">6</div>
</div> 
<script type="text/javascript">
$("#ppt_image div").mouseover(function() {
document.title = "mouseover:" + this.id;
}).mouseout(function() {
document.title = "mouseout:" + this.id;
});
</script>
</body>
</html>

Answer 12

我知道这种方法!
我之所以用function(){}这种方法 是因为我对JQ还不是很熟悉 有些我不知道如何实现!但是我将原先应用的JS的鼠标悬停效果应用到这里后 效果出不来 不知道是什么原因如果对问题感兴趣解决我可以发完整代码

Answer 13

演示地址
http://210.56.192.43/test123/有耐心请高手帮忙解决

Answer 14

var divs = $("#ppt_image div");

Answer 15

var divs = $("#ppt_image div");
这个就是问题啊。

Answer 16

将
tupian();
_start(); 放到
$(document).ready(function() { });里面。
-------------还有就是我做的这个幻灯片这浏览器打开后会加载很多效果! ie6会崩溃关闭 如何解决! ----
是你ready里面加载的东西太多。试着减少ready里面一次加载的数据。可以setTimeout的啊。

Answer 17

比如说我在页面加载的时候创建$("#ppt_button div:first").addClass("button1_3");如果应用setTimeout(code,millisec);
设置毫秒执行! setTimeout只执行一次 那和直接执行有什么区别?
$("#ppt_button div:first").addClass("button1_3");$(document).ready(function() { }); 中加载的代码会重复执行?应用的写法是否正确?
setTimeout($("#ppt_button div:first").addClass("button1_3"),1000);

Answer 18

setTimeout ("$(document).ready",1000 );这样写么?