Javascript image preload, show progress, and redirect when done?

Question

Hi there,

I don't know much about javascitp and have been sitting here the whole day trying to find a script for a pretty simple thing without success.

I need a script who can do the following:

1. A number of images will be preloaded

2. An animated gif image will be visible and some sort of bar (or text) will show the progress

3. When all images are preloaded the user will be redirected to another page

If some expert on javascript out there cold help me I would be incredibly grateful.

The script will replace the current (fake) loader on this page, which simply redirects after 20 seconds: www.worldsphotos.com

Thanks in advance!
Fredrik

Answer 1

Here is the code to preload an image.

var pic = new Array(1); // make this array size to match the number of images
pic[0] = new Image();
pic[0].src = 'images/imagename.jpg'; // preloads images

for the second part this may be a bit more tricky.
Try and create a general loading animated image to indicate progress rather than a progress bar.

I hope this helps.

Answer 2

That code tells me that the image is in the same place as the html. The norm is to put the images in the images folder. So where do you store our images?