Closed Thread Icon

Preserved Topic: preloader (Page 1 of 1) Pages that link to <a href="" title="Pages that link to Preserved Topic: preloader (Page 1 of 1)" rel="nofollow" >Preserved Topic: preloader <span class="small">(Page 1 of 1)</span>\

Nervous Wreck (II) Inmate

Insane since: May 2002

posted posted 05-21-2002 01:12

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.

Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 05-21-2002 01:53

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).

Maniac (V) Mad Scientist

From: Belgrade, Serbia
Insane since: Sep 2000

posted posted 05-21-2002 07:00

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

« BackwardsOnwards »

Show Forum Drop Down Menu