[[JavaScript/Library/script.aculo.us]]
&pgid();
#contents();
#blikimore
** Core Effects [#taed8bc5]
以下の6つで構成されます
- [[Effect.Opacity>JavaScript/Library/script.aculo.us/Effect.Opacity]]
- [[Effect.Scale>JavaScript/Library/script.aculo.us/Effect.Scale]]
- [[Effect.Morph>JavaScript/Library/script.aculo.us/Effect.Morph]]
- [[Effect.Move>JavaScript/Library/script.aculo.us/Effect.Move]]
- [[Effect.Highlight>JavaScript/Library/script.aculo.us/Effect.Highlight]]
- [[Effect.Parallel>JavaScript/Library/script.aculo.us/Effect.Parallel]]
*** Availability [#x90164a5]
script.aculo.us V1.0 以降で使用できます
*** syntax [#y0210ba7]
new Effect.EffectName( element, required-params, [options] );
elementはDOMエレメントのIDの文字列か、DOMエレメントのオブジェクトを指定します
required-paramsは使用するEffectによって変化します
optionsはEffectをカスタマイズするために追加で指定することができます
*** Common parameters [#y4f5965b]
すべてのCore Effectsで以下のパラメータを指定できます
|Option|since|Description|h
|duration|V1.0|Effectの開始から終了までの秒数をfloatで指定します. デフォルトは1.0です.|
|fps|V1.0|1秒間に画面を更新する回数を指定します. デフォルトは25です. 100以上は指定できません.|
|transition|V1.0|アニメーションの動きを制御する関数(0~1を返す)を指定します.&br; 次の関数が用意されています: Effect.Transitions.sinoidal (default), Effect.Transitions.linear, Effect.Transitions.reverse, Effect.Transitions.wobble, Effect.Transitions.flicker. &br;ソースにはpulse,spring,none,fullがあります.|
|from|V1.0|transitionの初期値を指定します, floatで0.0~1.0の間で指定します. デフォルトは0.0です.|
|to|V1.0|transitionの終了値を指定します, floatで0.0~1.0の間で指定します. デフォルトは1.0です.|
|sync|V1.0|自動でアニメーションを更新するかどうかを指定します(デフォルトでは自動で更新されます).&br;trueを指定した場合, render()をコールすることで更新することができます. これはEffect.Parallel()で使用されます.|
|queue|V1.5|Sets queuing options. When used with a string, can be ‘front’ or ‘end’ to queue the effect in the global effects queue at the beginning or end, or a queue parameter object that can have {position:’front/end’, scope:’scope’, limit:1}. For more info on this, see Effect Queues.|
|queue|V1.5|Sets queuing options. When used with a string, can be ‘front’ or ‘end’ to queue the effect in the global effects queue at the beginning or end, or a queue parameter object that can have {position:’front/end’, scope:’scope’, limit:1}. For more info on this, see [[Effect Queues>JavaScript/Library/script.aculo.us/EffectQueue]].|
|delay|V1.5|effect開始までの待ち時間を秒で指定します. デフォルトは0.0です.|
|direction|??|Sets the direction of the transition. Values can be either ‘top-left’, ‘top-right’, ‘bottom-left’, ‘bottom-right’ or ‘center’ (Default). Applicable only on Grow and Shrink effects.|
*** callback [#kb4b8c84]
さらに,optionにはcallback関数を指定することができます.
callback関数は引数としてeffect objectを受けとります.
|Callback|since|Description|h
|beforeStart|V1.0|Called before the main effects rendering loop is started.|
|beforeUpdate|V1.0|Called on each iteration of the effects rendering loop, before the redraw takes places.|
|afterUpdate|V1.0|Called on each iteration of the effects rendering loop, after the redraw takes places.|
|afterFinish|V1.0|Called after the last redraw of the effect was made.|
&br;
effect objectには以下のプロパティがあります.
|Variable|since|Description|h
|effect.element|V1.0|The element the effect is applied to.|
|effect.options|V1.0|Holds the options you gave to the effect.|
|effect.currentFrame|V1.0|The number of the last frame rendered.|
|effect.startOn,&br; effect.finishOn|V1.0|The times (in ms) when the effect was started, and when it will be finished.|
|effect.effects[]|V1.0|On an Effect.Parallel effect, there’s an effects[] array containing the individual effects the parallel effect is composed of.|
翻訳中
参考：[[CoreEffects>http://wiki.script.aculo.us/scriptaculous/show/CoreEffects]]
// #blikifooter(進地)
tag: [[Effects>tag/Effects]], [[JavaScript>tag/JavaScript]], [[Tween>tag/Tween]]
![[PukiWiki]](image/sandbox.gif "[PukiWiki]")
