Fx.Transitions overrides the base Fx constructor, and adds the possibility to use the transition option as string.

The equation to use for the effect. See Fx.Transitions. It accepts both a function (ex: Fx.Transitions.Sine.easeIn) or a string ('sine:in', 'bounce:out' or 'quad:in:out') that will map to Fx.Transitions.Sine.easeIn / Fx.Transitions.Bounce.easeOut / Fx.Transitions.Quad.easeInOut

A collection of tweening transitions for use with the Fx classes.

$('myElement').set('tween', {transition: Fx.Transitions.Elastic.easeOut});
$('myElement').tween('margin-top', 100);

• Robert Penner's Easing Equations

Displays a linear transition.

Displays a quadratic transition. Must be used as Quad.easeIn or Quad.easeOut or Quad.easeInOut.

Displays a cubicular transition. Must be used as Cubic.easeIn or Cubic.easeOut or Cubic.easeInOut.

Displays a quartetic transition. Must be used as Quart.easeIn or Quart.easeOut or Quart.easeInOut.

Displays a quintic transition. Must be used as Quint.easeIn or Quint.easeOut or Quint.easeInOut

Used to generate Quad, Cubic, Quart and Quint.

• The default is p^6.

Displays a exponential transition. Must be used as Expo.easeIn or Expo.easeOut or Expo.easeInOut.

Displays a circular transition. Must be used as Circ.easeIn or Circ.easeOut or Circ.easeInOut.

Displays a sineousidal transition. Must be used as Sine.easeIn or Sine.easeOut or Sine.easeInOut.

Makes the transition go back, then all forth. Must be used as Back.easeIn or Back.easeOut or Back.easeInOut.

Makes the transition bouncy. Must be used as Bounce.easeIn or Bounce.easeOut or Bounce.easeInOut.

Elastic curve. Must be used as Elastic.easeIn or Elastic.easeOut or Elastic.easeInOut

This class is only useful for math geniuses who want to write their own easing equations. Returns an Fx transition function with 'easeIn', 'easeOut', and 'easeInOut' methods.

var myTransition = new Fx.Transition(transition[, params]);

1. transition - (function) Can be a Fx.Transitions function or a user-provided function which will be extended with easing functions.
2. params - (mixed, optional) Single value or an array for multiple values to pass as the second parameter for the transition function.

• (function) A function with easing functions.

//Elastic.easeOut with user-defined value for elasticity.
var myTransition = new Fx.Transition(Fx.Transitions.Elastic, 3);
var myFx = $('myElement').effect('margin', {transition: myTransition.easeOut});

• Fx.Transitions