jQuery隊列函數只執行一次

如何在執行animated.css動畫之後將元素返回到其位置？我用這個代碼，但它只是執行一次，然後類didnt刪除下一次jQuery隊列函數只執行一次

$(".stitch") 
    .hover(function() { 
     $(this).addClass("animated hinge"); 
    }) 
    .delay(5000) 
    .queue(function() { 
     $(this).removeClass("animated hinge").dequeue(); 
    });

我想離隊和明年，但沒有工作。非常感謝您的幫助。

來源

2017-04-06 Mohsen

您是否正在尋找動畫完成後，除去上課嗎？ – hungerstar

是的，班級沒有第二次刪除，我也把警報和隊列沒有執行 – Mohsen

Animate.css有一個解決方案，在他們的文檔中，我已發佈在我的答案。 – hungerstar

如果你想在動畫完成後刪除動畫類，你可以使用簡單的jQuery插件代碼獲取Animate.css的文檔。

$.fn.extend({ 
 
    animateCss: function (animationName) { 
 
     var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend'; 
 
     this.addClass('animated ' + animationName).one(animationEnd, function() { 
 
      $(this).removeClass('animated ' + animationName); 
 
     }); 
 
    } 
 
}); 
 

 
var $me = $('#me'); 
 

 
$me.hover(function() { 
 
    $me.animateCss('hinge'); 
 
});

@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="me">Hello</div>

來源

2017-04-06 20:55:00 hungerstar

jQuery隊列函數只執行一次

回答

相關問題