DHTML : Creating a Slideshow
Mikael Le Moal
Preparing Images and Variables
The images that you want to publish need a bit of preparation. The script will use a smaller version of each image and all
the reduced images must be of the same size, since they are displayed in the same frame. By using this method instead of a
dynamic reduction of the images (resizing the image's height and width in the
<img> tag), we will speed up the loading process.
The right filenames. In this workshop, the small images are called
imgX.jpg, and the original ones
imgXg.jpg.
We first need to initialise the script with some data:
6: pause = 2;
7: vitesse = 5;
8:
9: tabImg = new Array ("img1.jpg","img2.gif","img3.gif");
10: tabImgn = new Array ("img1g.jpg","img2g.gif","img3g.jpg");
Two parameters are defined for the speed and the length of the pause (lines 6 and 7). The
vitesse variable defines how fast the successive images appear in the slideshow, and the
pause variable sets the short interval between two images.
The names of the files containing the images are placed in two arrays (lines 9 and 10). The first one stores the small images
and the second the larger ones. Make sure you correctly match the small and large versions of each image in the arrays.