Jquery проблема для остановки цикла

Question

Я получил этот код JQuery. И это какое-то слайд-шоу с эффектом затухания. Так что это циклы ... это первый код

$(document).ready(function(){
    function looptour(){
        $("#health").hide();
        $("#billing").hide();
        $("#pension").delay(6000).fadeOut(2000);
        $("#health").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000);
        $("#billing").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000);
        $("#pension").delay(14000).fadeIn(2000,looptour);
    }
    looptour();
});

Моя проблема заключается в том, как остановить цикл, который вы видели в первом событии onclick кода? Затем после нажатия этого события будет продолжен новый цикл и так далее ...

Вот новый код,

$("#tournums").click(function(){
    function billingloop(){
        $("#health").hide();
        $("#pension").hide();
        $("#billing").delay(6000).fadeOut(2000);
        $("#pension").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000);
        $("#health").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000);
        $("#billing").delay(14000).fadeIn(2000,looptour);
    }
    billingloop();
});

Большое спасибо мастерам jquery за помощь в решении моей проблемы.

Answer 1

Мое лучшее предположение - использовать .clearQueue() для этого:

function stopLoop() {
    $("#pension").clearQueue();
    $("#health").clearQueue();
    $("#billing").clearQueue();
}

// snip //

$("#tournums").click(function(){
    stopLoop();

    function billingloop(){
        $("#health").hide();
        $("#pension").hide();
        $("#billing").delay(6000).fadeOut(2000);
        $("#pension").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000);
        $("#health").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000);
        $("#billing").delay(14000).fadeIn(2000,looptour);
    }
    billingloop();
});