0

我在 jquery API 文档的帮助下制作了这个脚本，一切正常。

除了一件事，如果您离开悬停，我想完成当前事件（队列）。如果您离开某个 div，每个球都应该再次变得透明。我一直在寻找很长一段时间来实现这一点，但它没有帮助我。

也许这是一个愚蠢的问题，需要添加 1 行代码。但我希望你能帮我解决这个问题！

这是jsfiddle

这是jQuery代码：

$("#hulp").hover(function() {
        $("#first").delay   ( 100 ); 
        $("#second").delay  ( 200 );
        $("#third").delay   ( 300 );
        $("#fourth").delay  ( 400 );
        $("#fifth").delay   ( 500 );
        $("#sixth").delay   ( 600 );
    $("#first, #second, #third, #fourth, #fifth, #sixth").queue(function() {
        var that = $( this );
            that.addClass("red");
            that.dequeue ();
    });
        $("#fifth").delay   ( 1000 ); 
        $("#sixth").delay   ( 800 );


    $("#fifth, #sixth").queue(function() {
        var that = $( this );
            that.removeClass("red");
            that.addClass("blue");
            that.dequeue();     
    });
        $("#fifth").delay   ( 1200 ); 
        $("#sixth") .delay  ( 1000 );

     $("#fifth, #sixth")    .queue(function() {
        var that = $( this );
            that.removeClass("blue");
            that.dequeue();
            that.clearQueue();
    });
});
$("#hulp2").hover(function() {
        $("#first").delay   ( 100 ); 
        $("#second").delay  ( 200 );
        $("#third").delay   ( 300 );
        $("#fourth").delay  ( 400 );
        $("#fifth").delay   ( 500 );
    $("#first, #second, #third, #fourth, #fifth").queue(function() {
        var that = $( this );
            that.addClass("red");
            that.dequeue ();
    });
        $("#first").delay   ( 1400 ); 
        $("#second").delay  ( 1200 );
        $("#third").delay   ( 1000 );
        $("#fourth").delay  ( 800 );
        $("#fifth").delay   ( 600 );


    $("#first, #second, #third, #fourth, #fifth").queue(function() {
        var that = $( this );
            that.removeClass("red");
            that.addClass("blue");
            that.dequeue();     
    });
        $("#first").delay   ( 2200 ); 
        $("#second").delay  ( 2000 );
        $("#third") .delay  ( 1800 );
        $("#fourth").delay  ( 1600 );
        $("#fifth") .delay  ( 1400 );

   $("#first, #second, #third, #fourth, #fifth").queue(function() {
        var that = $( this );
            that.removeClass("blue");
            that.dequeue();
            that.clearQueue();
            that.finish();
    });
});
4

2 回答 2

2

而不是以 }); 结束悬停；在 } 之后添加以下代码

,function(){
    $('.helpen').nextAll('div').stop(true,true).removeClass('red blue');

});

演示

于 2013-09-12T09:27:24.657 回答
0

与on：

$('.fuuu').on({"mouseenter": function(){
        //do something
    },"mouseleave": function(){
        //do something else
    }});
于 2013-09-12T09:23:01.387 回答