ボタンが1回以上押された場合、jquery stopの遅延が発生する

Question

jqueryでアニメーションを呼び出すたびにコードをループさせないようにする方法があることは知っていますが、私の人生では見つけられません！

ボタンを複数回押してもループしないようにするには、以下のコードをどうすればよいですか？

$('#message-box').slideDown('slow').delay(10000).slideUp('slow'); 

私は一度以上は、それが再び戻ってダウンバックアップをスライドし、10秒のためのディスプレイを滑り落ちることを呼び出すボタンを押した場合。

私がしたいのは、すでにダウンしてボタンを押した後にでない場合は、にもう一度表示することです。それ以外の場合は、現在のメッセージをスライドさせ、その間に遅延なしに新しいメッセージをスライドさせます。

助けがあれば助かります。

デビッド

Answer 1

ですあなたはこれを試すことができる：

$('#message-box').stop(true,true).slideDown('slow').delay(10000).slideUp('slow'); 

ダウン遅延アップアニメーションが要素のためにすでに進行中であった場合、その後.stop(true)は、それを止める要素のアニメーションキューをクリアし、だけにしてダウン遅延アップ事をキューに再登録されます。

デモ：http://jsfiddle.net/bSeE7/

Answer 2

あなたが唯一のイベントは一度発生する場合

最も簡単な方法は、1（）

http://api.jquery.com/one/

$('#myButton').one('click', function(){ 
    $('#message-box').slideDown('slow').delay(10000).slideUp('slow'); 
}) 

Answer 3

チェックアウト ".one"

http://api.jquery.com/one/

Answer 4

$('#message-box').slideDown('slow', function(){ 
$('#message-box').delay(10000).slideUp('slow'); 
}) 

Answer 5

あなたはそれを実行している場合に起動されるのを防ぐために、条件を必要としています。コールバック関数はブール値をリセットして、アニメーションが終了したら再びそのボタンをクリックできるようにします。

var animationRunning = false; 

if(!animationRunning) { 
    $('#message-box').slideDown('slow') 
        .delay(10000) 
        .slideUp('slow', function() { animationRunning = false; }); 

    animationRunning = true; 
} 

Answer 6

これは、機能を実行する前にメッセージ要素が既にアニメーション化されているかどうかをチェックします。

$('#btn').click(function() { 
    if (!$('#message-box').is(':animated')) { 
     $('#message-box').slideDown('slow').delay(10000).slideUp('slow') 
    } 
}); 
​ 

Answer 7

（.stop使用）は明白な答えであるが.slideUpと共に使用される場合.stop（）が呼び出されるたびに（）高さのわずかな部分がまだ表示されています。 .stop(true,true)を使うことができますが、それはスライドアニメーションを「jumptoend」にしてぎこちないアニメーションを引き起こします。理想的ではない。

ではなく.slideUp（）

Fiddle

$('button').click(function() { 
    $('#message-box').stop(true).animate({height: 100}).delay(1000).animate({height: 0}); 
});