API/1.2/Effects

エフェクト

Sample 実際にやってみました。

　
NameType
show( )
Returns: jQuery
該当したエレメントが、非表示なら表示する。
show( speed, callback )
Returns: jQuery
該当したエレメントが、いかしたアニメーションで現れて、コールバック関数が「決める！」
hide( )
Returns: jQuery
該当したエレメントが表示されていれば、ふっと消える。
hide( speed, callback )
Returns: jQuery
魔法使いによって、呪文をかけたように、重みのある雰囲気で消えていく。もちろん、呪文はコールバック関数で、ビシッと効くよ。
toggle( )
Returns: jQuery
壊れた天秤ばかりのように、常にどちらか一方に傾く。開いていたものは、閉じるし、閉じているものは、全開。

Sliding:スライド

　　　　　　　
NameType
slideDown( speed, callback )
Returns: jQuery
該当するエレメントを、スライドダウンして表示する。もちろん必要ならコールバック関数も使えるよ
slideUp( speed, callback )
Returns: jQuery
該当するエレメントを、スライドアップして非表示にしてしまう。もちろん必要ならコールバック関数も使えるよ
slideToggle( speed, callback )
Returns: jQuery
開いていれば、閉じるし閉じていれば、開く。必要ならコールバック関数も使えるよ。

Fading:もあっと消えいる

NameType
fadeIn( speed, callback )
Returns: jQuery
フェードインしながら、表示する。もちろん必要ならコールバック関数も使えるよ。
fadeOut( speed, callback )
Returns: jQuery
もうこのまま消えてしまいたいと思ったときのように、フェードアウトします。もちろん必要ならコールバック関すも使えるよ。
fadeTo( speed, opacity, callback )
Returns: jQuery
透明になっちまうよ、コールバックも、よかったら使えば、、、

Custom:カスタム








NameType
animate( params, duration, easing, callback )

Returns: jQuery
君の実力と才能を試すための、特別なアニメーションのために
animate( params, options )
Returns: jQuery
君の実力と才能を試すための、特別なアニメーションのために
stop( )
Returns: jQuery
該当するエレメントのアニメーションを中止する。
queue( )待ち行列
Returns: Array<Function>
該当するひとつの要素の待ち行列の参照を返す。???

ここよくわかってません。鵜呑みにしないでね

アニメーションさせるための再帰関数

   function runIt() {
	
      jQuery("#qu").show("slow");
      jQuery("#qu").animate({left:'+=200'},2000);
      jQuery("#qu").slideToggle(1000);
      jQuery("#qu").slideToggle("fast");
      jQuery("#qu").animate({left:'-=200'},1500);
      jQuery("#qu").hide("slow");
      jQuery("#qu").show(1200);
      jQuery("#qu").slideUp("normal", runIt);
	  
    }
    runIt();

以下のコードで今処理されているのが、何番目かを知ることができる

	$("#count").click(function () {
	 	var n = $("#qu").queue("fx");
      	$("#res").text("Queue length is: " + n.length);    
	});

以下のコードで、runItをスタートする。

	$("#start").click(function () {
      $(this).queue("fx", runIt);
      //$("#qu").stop();
	  $(this).dequeue();
    });

dequeue()；でも、stop();でも動作はするようだけども、、、
先頭の処理が終わったら、溜め込まないで、dequeue();しなさいということか、、、

以下のコードで処理を停止する。

    $("#stop").click(function () {
      $("#qu").queue("fx", []);
      $("#qu").stop();
    });

配列には、もう何もないよということか

jQueryは、アニメーションさせるための再帰関数を書いたときには、最初の行から、順番に処理していく。最終的に、自分自身を呼び出しているので、このアニメーションは、ずーと動き続けることになる。

queueは、この連続した動作をコントロールできるようにする。
queue( )
Returns: Array<Function>
Returns a reference to the first element's queue (which is an array of functions).
queue( callback )
Returns: jQuery
Adds a new function, to be executed, onto the end of the queue of all matched elements.
queue( queue )
Returns: jQuery
Replaces the queue of all matched element with this new queue (the array of functions).
dequeue( )
Returns: jQuery
Removes a queued function from the front of the queue and executes it.