I have DOM node and click handler and I need to disable the action while animating. How can I check if element is currently being animated by a jQuery animation?

$('div').on('click', '.item', function() {
    if (/* this not animating */) {
        animate($(this));
    }
});

Do I need to set data('play') on that element that will be clear when finished or there is better way.

I have DOM node and click handler and I need to disable the action while animating. How can I check if element is currently being animated by a jQuery animation?

$('div').on('click', '.item', function() {
    if (/* this not animating */) {
        animate($(this));
    }
});

Do I need to set data('play') on that element that will be clear when finished or there is better way.

• javascript
• jquery
• animation
• dom
• jquery-events

Share Improve this question Follow edited Dec 12, 2020 at 9:24 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Aug 6, 2013 at 12:52 jcubicjcubic 66.7k5858 gold badges249249 silver badges455455 bronze badges 2

• 2 When you say "animating", are you referring to jQuery animations or to CSS transitions? – Frédéric Hamidi Commented Aug 6, 2013 at 12:53
• @FrédéricHamidi jQuery animation. – jcubic Commented Aug 6, 2013 at 12:57

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

Try using the following:

$('div').on('click', '.item', function() {
    $this = $(this); // cached so we don't wrap the same jquery object twice
    if (!$this.is(':animated')) {
        animate($this);
    }
});

View: animated selector documentation

Demonstration: http://jsfiddle/smerny/tBDL8/1/

Use

$(element).is(":animated");

You can check if an element is animating by using the :animated selector.

if($(this).is(":animated")) { ... }

For more information look at: http://api.jquery./animated-selector/