jquery - JQuery フェードインがフェードアウト後に 2 回呼び出される

Question

状況: 8 枚のスライドがあります。ページが開始すると、最初のものを除いてすべてが非表示になり、最初のページがクリックされるとフェードアウトし、次に 3 つが次々とフェードインします。次の 3 つ、その後、それらを非表示にしてフェードインします。結果とアニメーションはすべて問題ありませんが、すべてのスライドのフェードアウトの後、次のフェードインが 2 回呼び出され、アニメーションの全体的な外観が台無しになるという問題に直面しています。私は多くのこと、停止方法、非表示での書き込みなどを試しましたが、何が問題を引き起こす可能性がありますか?

jquery のコード:

$(".slide_top").click(function () {
animacija_init();
});

 var kadras;
var laikmatis;

function animacija_init() {
    kadras = 1;
    $(".slide_top").fadeOut(500);
    animacija_trigger();
}

function animacija_trigger() {
    if(kadras == 1) {
        $('.slide.one').delay(500).fadeIn("slow");  
        console.log("1");      
    }
    if(kadras == 2) {
        $('.slide.two').fadeIn("slow");
        console.log("2");
    }
    if(kadras == 3) {
        $('.slide.three').fadeIn("slow");
        console.log("3");
    }
    if(kadras == 4) {
      $('.slide').fadeOut(300, function() {
           $('.slide.four').delay(100).fadeIn("slow");
           console.log("4");
      });
    }
    if(kadras == 5) {
         $('.slide.five').fadeIn("slow");
         console.log("5");
    }
    if(kadras == 6) {
         $('.slide.six').fadeIn("slow");
         console.log("6");
    }
    if(kadras == 7) {
      $('.slide').fadeOut(300, function() {
           $('#last_slide').delay(300).fadeIn("slow");
           console.log("7");

    });
    }
    kadras++;
    laikmatis = setTimeout('animacija_trigger()', 2500);
    if(kadras == 8) {
         baigti_animacija();
    }
}

function baigti_animacija() {
    clearTimeout(laikmatis);
}

何かアドバイスはありますか？ライブの例はこちら: www.iamrokas.com/demo_boxi Console.log は、イベントの開始時刻を確認するために使用されます。

ありがとうございました！