javascript - .animate 無限ループ

Question

.animatejQuery無限ループブレークメソッドの解決策に興味があります。

$(element).mouseover(function() {
   $(this).animate({ opacity: 1 }, duration, customFunc);
}).mouseout(function() {

});

そして問題は、このループをどのように断ち切るかです。例えばmouseoutイベント内？

私はそれを簡単に行うことができますがsetInterval、関数clearIntervalでそれを行う方法はあり.animateますか?

score 4 · Accepted Answer

.stop メソッドを使用します。

現在実行中のアニメーションをすぐに停止したいと思いますか?

$(element).mouseover(function() {
   $(this).animate({ opacity: 1 }, duration, customFunc);
}).mouseout(function() {
   $(this).stop();
});

score 1 · Accepted Answer

.stop() を使用してアニメーションを停止できます

.stop(true, true) を使用してキューをクリアし、アニメーションの最後にジャンプしたい場合があります

.data() を使用して、もうアニメーション化する必要があるかどうかのフラグを保存できます

animate を再度呼び出す前に、customFunc に IF を追加して、アニメーション化する必要があるかどうかのフラグを確認します。そうすれば、他のコールバックが原因で再起動することはありません。マウスオーバーで、フラグを再度有効に設定する必要があります。

score 0 · Accepted Answer

あなたが経験しているのは、マウスが要素に出入りするときにアニメーションがキューに入れられ、マウスが要素を離れて戻ってこなかった後もアニメーションを何度も繰り返し続けるという効果である場合は、jquery hoverflow をお勧めしますあなたのためのプラグイン。

3 に答える 3