Image Animation using JavaScript

Loading...
Slower Faster

To create an animation like this, you must first create a series of images. Then, to play those images back easily, the images must be preloaded into arrays.
First define these variables, which define the delay and total number of images:

    delay = 100;            <-- delay time of the animations (.1 sec.)
    imgNumber = 0;          <-- number of the image in the animation 
    totalimgNumber = 8;     <-- total number of images
    anim = new Array();     <-- images array
Next, preload all of the images into an arrays; this can be done very efficiently using a for loop.
    for (i = 0; i < totalimgNumber; i++) {
    anim[i] = new Image (239, 390);
    anim[i].src = 'wave' + (i + 1) + '.gif';
    } 

Osmar R. Zaïane, Copyright © 1996,1997 02/05/97 slide: 48/50 47 49