animation.js

Implements basic animation framework, as well as some pre-defined animation effects.


Objects

Methods

Messages

REMARK: When attaching message listeners to Animation* derivatives, attach them to the .animation property instead. Example:

var as = new OAT.AnimationSize("myDiv");
OAT.MSG.attach(as.animation, OAT.MSG.ANIMATION_STOP, myCallback);

OAT.Animation(element, optionsObject)

Creates animation of element. All parameters are specified in optionsObject; for most use cases, it is more suitable to use some pre-defined Animation* object. Properties of optionsObject:

OAT.AnimationSize(element, optionsObject)

Animates element's size. Properties of optionsObject:

OAT.AnimationPosition(element, optionsObject)

Animates element's position. Properties of optionsObject:

OAT.AnimationOpacity(element, optionsObject)

Animates element's opacity. Properties of optionsObject:

OAT.AnimationCSS(element, optionsObject)

Animates element's CSS property. Properties of optionsObject:

OAT.Animation::start()

Starts the animation.

OAT.Animation::stop()

Stops the animation.

var div = Dom.create("div");
var a = new OAT.AnimationOpacity(div, {opacity:0.5, delay:50, speed: 0.02});
a.start(); // will slowly make <div> element 50% transparent