fade function jquery slider is hooked

Question

The code I created works but if you click on de buttons quickly the slider is hooked.

Jquery

$(document).ready(function(){
$(".list div").each(function(e) {
    if (e != 0)
        $(this).hide();
});

$("#next").click(function(){
    if ($(".list div:visible").next().length != 0){
        $(".list div:visible").stop().next().stop().fadeIn().prev().stop().fadeOut();

    } else {
        $(".list div:visible").fadeOut();
        $(".list div:first").fadeIn();
    }
    return false;
});

$("#prev").click(function(){
    if ($(".list div:visible").prev().length != 0){
        $(".list div:visible").prev().stop().fadeIn().next().stop().fadeOut();
    } else {
        $(".list div:visible").fadeOut();
        $(".list div:last").fadeIn();
    }
    return false;
});
});

Whats wrong with this code?

Hope somebody can help me.

Greets Yoeri

possible duplicate of [How do I find out with jQuery if an element is being animated?](http://stackoverflow.com/questions/724911/how-do-i-find-out-with-jquery-if-an-element-is-being-animated) — D4V1D, Sep 08 '15 at 08:54

score 0 · Answer 1 · answered Sep 08 '15 at 09:13

Check if your element is currently being animated:

$("#next").click(function(){
    if ($(".list div:visible").next().length != 0 && !$(".list div:visible").is(':animated')){ // notice the second condition
        $(".list div:visible").stop().next().stop().fadeIn().prev().stop().fadeOut();

    } else {
        $(".list div:visible").fadeOut();
        $(".list div:first").fadeIn();
    }
    return false;
});

And do the same for $("#prev").click();

fade function jquery slider is hooked

1 Answers1