![]() | |||||||||
|
|
|
|
|
|
|
|
|
|
|
|
Preload Your Images
Why would you want to preload your images? Well, for example, if you have several images as part of your layout, this is very important to preload them, before they actually have to be used. If you don't, while the visitor is viewing your website, he/she will have to keep waiting for it to load. Why not load it all at once from the start? The code is simple. It goes in your header, which means it goes in the HEADer. Here's the code itself. Edit what is is CAPS LOCK.
Basically, just change the name of the image that is IN CAPITAL LETTERS to what it has to be. You can repeat this basically as many times as you need. Just add this code and update the information needed in the function preLoad:
Just make sure you put it between the braces: the "{" and the "}". Now, you have to call this function. If you don't actually make a function call, the preload function will not be opened and run. To do this, just put Put it in a Body tag like so:
There is also another way to do this. If you want to have a preload page that once the images are fully loaded redirects straight to the layout page, you should use this code. First make a preload.html page, and link to it from your index/splash page. (Basically instead of linking the enter text to the layout url, you link to preload.html) Now on preload.html, you put this code, instead of the one above. This one has a check function, and once all the images have loaded, then it directs to the layout url. Just update the url to link to in the code. For the rest, do as the above part said. If you want the "All images loaded properly" message to pop up, just remove the "//" right before the alert.
| |||||||||