How do I find out with jQuery if an element is being animated?

JavascriptJqueryAnimation

Javascript Problem Overview

I'm trying to move some elements on the page, and during the time the animation occurs, I want to have "overflow:hidden" applied to an elemnt, and "overflow" back to "auto" once the animation is completed.

I know jQuery has an utility function that determines whether some element is being animated but I can't find it anywhere in the docs

Javascript Solutions

Solution 1 - Javascript

if( $(elem).is(':animated') ) {...}

More info: https://api.jquery.com/animated-selector/

Or:

$(elem)
    .css('overflow' ,'hidden')
    .animate({/*options*/}, function(){
        // Callback function
        $(this).css('overflow', 'auto');
    };

Solution 2 - Javascript

Alternatively, to test if something is not animated, you can simply add a "!":

if (!$(element).is(':animated')) {...}

Solution 3 - Javascript

if you are using css animation and assign the animation by using specific class name, then you can check it like this:

if($("#elem").hasClass("your_animation_class_name")) {}

But make sure that you are removing the class namewhich is handling the animation, after the animation is finished!

This code can be used to remove the class name after the animation is finished:

$("#elem").on('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend',
function(){ 
        $(this).removeClass("your_animation_class_name");
});

Solution 4 - Javascript

If you want to apply css to animated elements, you can use the :animated pseudo selector and do it like this,

$("selector").css('overflow','hidden');
$("selector:animated").css('overflow','auto');

source : https://learn.jquery.com/using-jquery-core/selecting-elements/

Solution 5 - Javascript

$('selector').click(function() {
  if ($(':animated').length) {
    return false;
  }

  $("html, body").scrollTop(0);
});
Categories
Recommended Javascript Solutions
Recommended Jquery Solutions
Recommended Animation Solutions

Previous Solution:

Rails "validates_uniqueness_of" Case Sensitivity

Ruby on-RailsValidationModel

Next Solution:

Valid use of goto for error management in C?

CException HandlingError HandlingGoto

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRaduView Question on Stackoverflow
Solution 1 - JavascriptJamesView Answer on Stackoverflow
Solution 2 - JavascriptTimView Answer on Stackoverflow
Solution 3 - JavascriptAriView Answer on Stackoverflow
Solution 4 - JavascriptLuckyView Answer on Stackoverflow
Solution 5 - Javascriptanand vishwakarmaView Answer on Stackoverflow