stop()

stop()はアニメーションをストップする為のメソッドです。

jQueryのアニメーションに対して実行すると現在実行されているアニメーションがストップします。

$(".start").click(function(){
	$(".ele").animate({width:1000},4000);
});
$(".stop").click(function(){
	$(".ele").stop();
});

sample

第１引数にtrueを設定することでアニメーションのキューをクリアします。通常はストップされた場合に次のアニメーションが発生しますがtrueを指定することで次以降のアニメーションを停止できます。

$(".start").click(function(){
	$(".ele").animate({width:1000},4000).animate({width:10},4000);
});
$(".stop").click(function(){
	$(".ele").stop(true);
});

sample

第2引数にtrueを設定することでアニメーションの終了時の状態まで一気に変更できます。

$(".start").click(function(){
	$(".ele").animate({width:1000},4000);
});
$(".stop").click(function(){
	$(".ele").stop(true,true);
});

sample

jQuery 1.7.0より第１引数にキュー名を指定して指定したキューのアニメーションのみ停止することが可能になりました。

$(".start").click(function(){
	$(".ele").animate({
		width: 1000
	}, {
		duration: 10000,
		queue: "queue01"
	}).dequeue("queue01")
});
$(".stop").click(function(){
	$(".ele").stop("queue01");
});

sample

jQuery 1.2.0での追加/変更

stop()はjQuery 1.2.0で追加されたメソッドです

jQuery 1.7.0での追加/変更

jQuery 1.7.0から停止するアニメーションのキュー名を指定することが可能になりました。

参考URL

.stop() – jQuery API

登録日 : 2012年12月30日最終更新日 : 2012年12月30日

jQuery リファレンス

stop()

参考URL

同じカテゴリー(Effects)のエントリー

検索

スポンサードリンク

バージョン

リファレンス