要素がアニメーション化されているかどうかをjQueryで確認するにはどうすればよいですか？

ページ上のいくつかの要素を移動しようとしています。アニメーションが発生している間、要素に「overflow：hidden」を適用し、アニメーションが完了したら「overflow」を「auto」に戻したいと思います。

jQueryに、いくつかの要素がアニメーション化されているかどうかを判断するユーティリティ関数があることを知っていますが、ドキュメントのどこにも見つかりません

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

詳細：https : //api.jquery.com/animated-selector/

または：

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

または、アニメーション化されていないものがあるかどうかをテストするには、「！」を追加するだけです。

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

cssアニメーションを使用していて、特定のを使用してアニメーションを割り当てる場合はclass name、次のように確認できます。

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

ただし、アニメーションが終了したら、アニメーションを処理しているクラス名を必ず削除してください。

このコードを使用してclass name、アニメーションの終了後にを削除できます。

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

CSSをアニメーション化された要素に適用したい場合は、:animated疑似セレクターを使用して次のように行うことができます。

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

ソース：https : //learn.jquery.com/using-jquery-core/selecting-elements/

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

  $("html, body").scrollTop(0);
});