Preserved Topic: preloader (Page 1 of 1)

you see this effect all the time with flash, but i'm starting to see some dhtml sites do this too. i'm interested in how this is done. any leads are appreciated. i know it's probably a lot to explain so the general concepts will be good enough. that way i have a general direction to take.

In JavaScript, make an array of all your images using Image objects. Maybe separate arrays; that's up to you.

Set each of the image objects' onload events to some function.

Have that function check which images have loaded. You'll need each image's file size in a saparate array.

Have the function update some sort of horizontal loading bar, making the filled in part have the width of (the file size of the images that have loaded)/(all the image file sizes combined)*(the full width of the loading bar).

Also, lookting at ready made script can help you understand how all this works... Take a look at:

http://www.dynamicdrive.com/dynamicindex4/preloadimage.htm
http://www.dynamicdrive.com/dynamicindex4/preloadimage2.htm