Making an image download before the rest of the page does?

[Keiron Waites]

Hi,

Is there any JavaScript that can force the download of an image or a list of
images before the HTML, or any other images are downloaded? This is
necessary so I can force the background image to download before anything
else does.

TIA,

Keiron

 

[cwdjr]

If you are willing to use a preload page, you can load all of the
images before your page starts. Dynamic Drive at www.dynamicdrive.com
has ready-made preload pages. You can use most of them for free
provided you leave the Dynamic Drive credits intact in comments in the
script. They are easy to use. You have to set up two 1 x 1 px solid
color gifs for the colors of the status bar. You can position the
loading status bar as desired. You put in the URL of your main page to
which you automatically transfer as soon as preloading is completed.
You must fill in an array of URLs for your images. If your page takes
a bit of time to load you can include some text on the preload page to
keep the viewer busy while preloading. Also you can tell a viewer to
reload and/or turn on JS if there is no motion of the preload bar. A
preload page may not be right for every application, but it is a nice
trick to have at hand for many pages that otherwise produce problems.

 

[VBDude]

I do agree with Lasse Reichstein Nielsen that if the page is useless without
the background then redesign it.

On the other hand, why don't you look at the problem from the other
way. How can I hide the contents until the picture(s) are loaded ?

Use the following statement to hide everything inside a DIV:
document.getElementById("YourDivID").style.display = "none";

Use the following statement to show everything inside a DIV:
document.getElementById("YourDivID").style.display = "";