There are 5 functions that operate on an animated image.


All operations work on the AnimatedImage object, which is always passed as one of the parameters to the above functions.

In order to understand how the turn_on() and turn_off() functions work, think in terms of a normal rollover. When you mouse over a link the link is "turned on". When you mouse out of a link, the link is "turned off". The difference between a normal rollover and an animated rollover is that once you have "turned on" an Animated Rollover it must run through all the animation frames to the on state. (This is easy for a normall rollover because as soon as you swap the image you are already in the "on state"). If you have seen the "animated led's" example then you will know why this is. Once the led is turned on, it must grow to full brightness before it can be turned off.

These two functions have an overloaded form that take 2 parameters. The reason for this is so that a different AnimationFrames can be run in the same AnimatedImage. This is usefull for situation such as "TV remote" type interfaces where a different image is displayed in tha same part of the page onMouseOver of different links. (See the Image Fader demo)

The functions animate_to(), animate_upto() and animate_downto() work best on looping animations, although they are not restricted to them. The Animated Globe Interface is an example of how to use these functions. They animate the image to a particular frame and then stop. It is best not to mix these 3 functions with the turn_on() and turn_off() functions as they use different "states" during the animation.