jquery clearQueueメソッド

TOPページに戻る > jquery入門

スポンサード リンク

jquery clearQueue()メソッド

clearQueueメソッドは、指定した要素に設定したキューのなかでまだ実行されていない全ての関数を削除します
stop()とは違い、.queue()で作ったアニメーションにも使用できます

.clearQueue()

キューに登録されている関数の数を表示する方法

ボタンをクリックすると指定した要素をアニメーションさせて、.clearQueue()で実行していないキューを削除します

jquery

$(function() {
	$("button").click(function(){
		$("#hoge").animate({left:"300px"},1000).queue(function(){
			$(this).css({backgroundColor:"#0C0"}).dequeue();
		})
		.animate({left:"500px"},1000)
		.animate({left:"0px"},1000).queue(function(){
			$(this).css({backgroundColor:"#FC9"});
		})
	});
	$("#foo").click(function(){	
	 $("#hoge").clearQueue();
	});	
});
css
#hoge{
 background-color: #FFCC99;
 width: 250px;
 height: 250px;
 position: relative;
 }

html

<button>ボタン</button>
<button id="foo">未実行のキューを削除</button>
<div id="hoge"></div>


サンプル







(C)2012 ホームページ作成無料