DHTML : Images scrolling under your titles
Contents ]
Dr Benton

Preloading the Images

To prevent the animation from slowing down, the images must be loaded at the same time as the page. They are then used when they are already in the browser cache. In this way, the visitors will not notice any imperfections, even if the link is slow.

25: var messageboard = new Array()
26: messageboard[0]="messageboard1.gif"

[...]

53: var imgpreload=new Array()
54: for (i=0;i<=messageboard.length-1;i++) {
55: imgpreload[i]=new Image()
56: imgpreload[i].src=messageboard[i]
57: }
58:
59: var bgimgpreload=new Image()
60: bgimgpreload.src=bgimage

First of all, the address of the text image is stored in the messageboard array (line 26). This address is then used on lines 53 to 56, where we use the src attribute of the imgpreload[] array to preload the image.

The same technique is used for the background image on lines 59 and 60.

Why do we need an array? Our script has many hidden possibilities! We use an array for displaying the title image so that we can select several different images. They will then be successively displayed in the animation.



  1   2   3   4   5   6