Skip to content Skip to sidebar Skip to footer

Jquery: Disable Click During Animation

So I am making a little quiz, with a I want to disable the click for everything inside #qWrap while the animation is operating, thus preventing spamming clicks. I tried to use .is(

Solution 1:

Your JS code should look like this:

$('.qAnswers li a').bind('click', function(event) {
    event.preventDefault();

    //preventing click within #qWrap if ($('#qWrap').is(':animated')) {
        return;
    }

    $(this).parent().addClass('selected');
    $(this).closest('.qAnswers').find("li:not(.selected, .qQuestion)").delay(200).addClass('notSelected');
    var $anchor = $(this);


    //firing the animation
    $('#qWrap').stop(true, true).delay(800).animate({
        scrollLeft: $($anchor.attr('href')).position().left
    }, 2000, function() {
        nextCount();
    });
    stopTimer();
    addData();
});

The code $('#qWrap').is(':animated') is not an event that will trigger when the element is animating, it's a normal check. I moved your event.preventDefault(); to the top also; figured you want to do that regardless. You might need to move around some other things also.

Solution 2:

$('[where you click]').click(
function(){
    if(!$('[what animates]').is(':animated')){
        $('[what animates]').[your_animation];
    }
});

Post a Comment for "Jquery: Disable Click During Animation"