memo.xight.org

日々のメモ

Effect.Transitions - script.aculo.usのEffectの変化曲線を変更する

Summary

effect.jsに以下の記述がある.
これはEffectの変化曲線を設定している.
デフォルトの変化曲線はsinカーブと同じ.

Effect.Transitions.sinoidal = function(pos) {
	return (-Math.cos(pos * Math.PI) / 2) + 0.5;
}


Effectのコンストラクタでオプションにtransitionをセットすることで,
変化曲線を変更可能.
new Effect.Move( 'elementId', {
		x: 100,
		y: 100,
		transition : function ( pos ) {
		return Math.pow( pos, 2 );
	}
});


Sample

Sample

Reference

d.aql - scriptaculousのトランジション
http://d.hatena.ne.jp/aql/20051123/1132725850