0

jquery API ドキュメントの助けを借りてこのスクリプトを作成しましたが、すべて正常に動作しています。

1つを除いて、ホバーを離れると現在のイベント(キュー)を終了したい. 特定の 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 に答える