Operator for invoking CSS Transition-based CSS animations, bypassing the scripty2 effects engine and using browser native CSS transitions.
This class is only defined if running on a browser that supports CSS transitions and CSS transition events.
- Transitions are limited to 'linear' and 'sinusoidal' (default)
- Some CSS properties can't be animated with CSS transitions
- The propertyTransitions option is not supported
S2.FX.Morph will automatically detect if a non-supported feature
You can query the
to check if CSS transition support is enabled.
In certain environments, the browser is able to use hardware acceleration to deliver much smoother animations. Normally this is only available with CSS transforms, since animation of any other property (even via CSS transitions) involves re-computing an element's layout with each frame of animation.
CssTransition operator circumvents this by converting
certain property animations to their CSS-transform equivalents, if
possible. For instance, animating the movement of an absolutely-
positioned element can be expressed with a
assuming the element's dimensions do not change.
For more information on accelerated compositing, consult this page on the WebKit wiki.
Currently, only these environments support hardware acceleration:
- Safari 4.0 on OS X 10.6 (Snow Leopard)
- MobileSafari on iPhone OS >= 3.0
- Certain versions of QtWebKit