stopメソッド

メソッド stop は、実行中のアニメーションを即座に 停止することを可能にします。アニメーションは次の関数から 前の処理を完了することなく再開されます。

構文

これが実行中のアニメーションを停止する方法です。二つのオプションの パラメータを渡すことができ、それらは真偽値を受け取ります。 最初のパラメータを true に設定すると、 アニメーションキューに残っている関数は削除され、 決して実行されません。二つ目のパラメータを true に設定すると、アニメーション停止時に 要素のCSSプロパティは即座に最終的な値を取ります (つまり、要素をスムーズに非表示にすることが目的だった場合、 要素は瞬時に非表示になります):

javascript.stop([clearQueue], [jumpToEnd]);

オプションのパラメータとして、キューの名前を 指定することもできます:

javascript.stop([queueName], [clearQueue],[jumpToEnd]);

アニメーションは、設定 jQuery.fx.off = true を使用してグローバルに無効にすることができ、 これにより継続時間の値が0に設定されます。

例

ボタン #toggle がクリックされるたびに、 メソッド slideToggle を使用して 長方形が展開したり折りたたまれたりするようにしましょう。 メソッド stop のおかげで、 アニメーションの完了を待たずにボタンをクリックしてください - 次の段階は前の段階の完了を待たずに開始されます:

html<button id="toggle">toggle</button>
<div id="test"></div>
css#test {
  background-color: green;
  border: 1px solid black;
  width: 200px;
  height: 100px;
  margin: 10px;
}
javascript$('#toggle').on('click', function() {
  $('#test').stop().slideToggle(1500);
});

関連項目

  • メソッド clearQueue,
    これは実行待ちの関数をすべてキューから削除することを可能にします。
  • プロパティ jQuery.fx.off,
    これはアニメーションをグローバルに無効にすることを可能にします。