The Animator Applet

A Gamelan's Best Java winner!
The Animator applet is a general purpose animation tool. It's available in both 1.0.2-compliant (v1.9) and 1.1-only (v1.10) versions. The 1.0.2-compliant version of Animator works in any Java-compatible browser. The 1.1-only version works only in browsers that have been updated to support the 1.1 API. If you don't know which version you need, then you should probably take the 1.0.2-compliant version.

The current versions have these features:

Please try out the Animator applet for your own animations and let us know what you think.

Here's the 1.0.2-compliant source code. (Here's the 1.1-only source code.) You can save the source code by bringing up the View Source window for it, and clicking the Save button. Then compile it (with javac, the Java compiler) and try it out.

Or grab all of the 1.0.2-compliant .class files here:

Or individually:

The Animator applet isn't finished -- we plan to add more features -- but we'd appreciate your suggestions. Send bug reports and feature requests to

You can get a bunch of information about Animator by pressing the SHIFT key while clicking the mouse in an Animation.

Tag Syntax

<APPLET CODE="Animator.class"
     WIDTH="aNumber"             -- the width (in pixels) of the widest frame
     HEIGHT="aNumber">           -- the height (in pixels) of the tallest frame
     VALUE="aDirectory">         -- the directory that has the animation
                                    frames (a series of pictures in GIF or JPEG
                                    format, by default named T1.gif, T2.gif,
     VALUE="aFile">              -- an image to display at load time
     VALUE="aFile">              -- an image to paint the frames against
     VALUE="aColor">             -- a solid color to paint the frames against
     VALUE="aNumber">            -- number of the starting frame (1..n)
     VALUE="aNumber">            -- number of the end frame (1..n)
     VALUE="dir/prefix%N.suffix"> -- a pattern to use for generating names
                                    based on STARTIMAGE, ENDIMAGE, or IMAGES. (See
     VALUE="100">                -- milliseconds to pause between images
                                    default - can be overridden by PAUSES)
     VALUE="300|200||400|200">   -- millisecond delay per frame.  Blank
                                    uses default PAUSE value
     VALUE="true">               -- repeat the sequence?
                                 -- positions (X@Y) for each frame.  Blank
                                    means use previous frame's position
     VALUE="3|3|2|1|2|3|17">     -- explicit order for frames - see below
     VALUE="aDirectory">         -- the directory that has the audio files
     VALUE="aFile">              -- an audio file to play throughout
				 -- audio files keyed to individual frames
     VALUE="aURL">               -- The URL of the page to visit when
                                    user clicks on the animation (if not set, 
                                    click pauses/resumes the animation)
     VALUE="aTarget">            -- The name of a FRAME target in which
                                    to display the document named by
                                    HREF.  Defaults to "_top".


You can specify either an IMAGES list or a STARTIMAGE/ENDIMAGE range, but not both. The IMAGES list is a string of frame numbers in the order in which you wish them to display, separated by vertical bars. You can use NAMEPATTERN with IMAGES or STARTIMAGE/ENDIMAGE to generate the file names to use.

STARTIMAGE and ENDIMAGE let you specify a range of images. Specifying an ENDIMAGE that is numerically less than the STARTIMAGE will display the images in reverse order. Both parameters have default values of 1, so specifying only STARTIMAGE="15" means "play the frames in reverse order from 15 to 1." Saying only ENDIMAGE="13" means "play the frames from 1 to 13." Of course, you can use both STARTIMAGE and ENDIMAGE together.

NAMEPATTERN lets you specify how to generate the names of the files in the range STARTIMAGE to ENDIMAGE. The pattern is like a URL with substitution. Any instance of the characters '%N' will have the current index (integer in the STARTIMAGE..ENDIMAGE range) substituted for it; any instance of '%[digit]' -- for example, '%5' -- will have the index plugged in, left-padded with zeroes. Finally, '%%' substitutes a single '%'.

Some examples (all assume STARTIMAGE = 1 and ENDIMAGE = 10):

This is the default pattern, and will generate the names T1.gif, T2.gif, ...T10.gif.
NAMEPATTERN = "anim%3/anim%3.jpg"
This will generate the names anim001/anim001.jpg, ... anim010/anim010.jpg
NAMEPATTERN = "100%%frame%N.jpg"
This will generate the names 100%frame1.jpg, 100%frame2.jpg, etc.

Example files

Animated coffee beans, with a soundtrack and per-frame sound effects.
A simple two-frame animation.
A simple beany animation with start-up image.
Animated coffee beans with POSITIONS, HREF, and BACKGROUNDCOLOR.

Herb Jellinek |