0

リンクをクリックするとボックスが順番に表示されるアニメーションがあります。新しいリンクをクリックしてもアニメーションが停止せず、順序が狂って表示されることがよくあります。ゲスト間をすばやくクリックすると、ここでこれを確認できます。$.animation.stop()何かが問題を解決すると思いましたが、そうではありませんでした。どんな助けでもいただければ幸いです。

            var stepFade = function() {
                if ($($this).data("known1") === undefined || null) {
                    $('.guest-data .known-for').css('display', 'none');
                } else {
                    $('.guest-data .known-for').css('display', 'block');
                    $('.guest-data .known-for li').eq(0).delay(200).fadeIn( 300);
                    $('.guest-data .known-for li').eq(1).delay(300).fadeIn( 300);
                    $('.guest-data .known-for li').eq(2).delay(400).fadeIn( 300, function() { animating = false; });
                }
            }

            //Fade guest
            if (!featured) {
                featured = true;
                getData();
                $('.featured').fadeOut( 500, function () {
                    $('.selected').animate({ opacity: 'toggle'}, 500, function() {
                        stepFade();                     
                    });
                })
            } else {
                $('.selected, .guest-data .known-for, .guest-data .known-for li').fadeOut( 500, function () {
                    getData();
                    $('.selected').fadeIn( 500, function() {
                        stepFade();
                    });
                });
            }
4

1 に答える 1

1

queueのオプションを.animate()に設定してみましたfalseか？
このように、アニメーションはキューに入れられず、すぐに開始されます。

$('.selected')
    .animate({opacity: 'toggle'}, 
             {duration: 500, queue: false,  
                complete: function() { stepFade(); }
             });

...または、電話をかける.stop()直前に電話をかけることもできます.animate()：

$('.selected')
    .stop(true, false) //clear the queue and don't jump to the end
    .animate({opacity: 'toggle'}, 500, function() {
                        stepFade();
                    });
于 2013-01-29T02:55:42.917 に答える