我正在制作一個Twitch Streamer應用程序，該應用程序使用Twitch API為一組預定義的拖放器提取一些數據。Animate.css抖動效果每次都不工作

我有三個按鈕來選擇所有/在線/離線頻道，并且我正在為所有這些按鈕添加animated shake效果。

在我第一次嘗試時，我做了一個簡單的if/else檢查，以使shake正常工作 - 檢測animated shake類是否已經存在，如果是，請將其刪除，然后重新添加。否則，只需添加它。

這沒有奏效。我在這里找到了一個答案，表示它不會那樣工作，因為addClass和removeClass發生得如此之快以至于DOM沒有時間趕上。

然后我用一個queue一個匿名函數要添加的類別后引起輕微的延遲后回removeClass -

if ($(this).hasClass("animated shake")) {

$(this).removeClass("animated shake").delay(50).queue(

function() {

$(this).addClass("animated shake");

});

//$(this).addClass("animated shake");

} else {

$(this).addClass("animated shake");

}

現在，防抖效果就像中90％的時間，但如果你不斷在線/離線頻道之間來回切換，會出現搖晃不起作用的情況。

以下是Codepen上的應用程序。

我會很感激任何幫助，為什么它不工作每一次。

注 - 搖動效果現在只在在線/離線按鈕上。

總結

以上是生活随笔為你收集整理的animate.css动画抖动,Animate.css抖动效果每次都不工作的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。