CODEWITHSUNDEEP
javascriptjqueryhtmlonclick
ranieri
ranieri

Reputation: 2088

Block jquery function while something is sliding

I have a menu with 6 options, each one of them is supposed to show a div elsewhere with some text. I added jQuery function to this menu, when I click any option, the correct div slides down and any other div slides up again.

The problem is, if someone clicks very fast on different items, more than one div open at the same time. How can I control this, like disabling the function while the div is loading/unloading?

It is simple HTML, no PHP page.

Upvotes: 0

Views: 74

Answers (2)

Joel Grannas
Joel Grannas

Reputation: 2016

You can check out the http://api.jquery.com/animated-selector/ to see if something is being animated, and if so, return;

Example:

$("#clickme").click(function(){
    if ($(".slider:animated")) return;
    //DO YOUR ANIMATION CODE
});

You can also try adding a global variable, like "var animating". set it to true when you start the animation. then set it back to false when the animation completes.

Then in your click function(s) only allow a click if(animating == false)

var animating;

$('#clickme').click(function() {
    if(!animating){
        animating = true;
        $('#book').animate({
            opacity: 0.25,
            left: '+=50',
            height: 'toggle'
        }, 5000, function() {
            // Animation complete.
            animating = false;
        });
    }
});

Upvotes: 1

Rory McCrossan
Rory McCrossan

Reputation: 337656

Assuming you're using animate() or are using the queue() you can use stop() to end animations.

Without seeing your code or HTML that's about as much help as I can offer.

A potential example:

<ul class="my-collapsible-content">
  <li>Some text</li>
  <li>Some other text</li>
  <li>Some more text</li>
</ul>


$('.my-collapsible-content').on('click', '>li', function(){
    $(this).siblings().stop(true, true); //stops animation and jumps to 'final' state immediately
    $(this).animate(.....);
})

Upvotes: 2

Related Questions