Question

我正在尝试移动页面上的一些元素，并且在动画发生期间，我希望将“overflow：hidden”应用于elemnt，并且一旦动画为“overflow”则返回“auto”完成。

我知道jQuery有一个实用程序函数，可以确定某些元素是否正在动画，但我无法在文档中的任何位置找到它

Answer 1

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

更多信息：http://docs.jquery.com/Selectors/animated

或者：

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

Answer 2

或者，要测试某些内容是否未设置动画，您只需添加“！”：

即可

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

Answer 3

如果要将css应用于动画元素，可以使用:animated伪选择器并按照这样做，

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

来源：https://learn.jquery.com/using-jquery-core/selecting-elements/

Answer 4

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

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

Answer 5

如果您使用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");
});

如果元素是动画的，我如何找到jQuery？

5 个答案: