Implementation: To implement this script you don’t need any Javascript experience. Just follow these easy steps:
1. Download the zipped archive.
2. Upload the contents to your webserver.
3. Place the following code in the part of your page:
Code
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'></script>
<link rel="stylesheet" href="css/queryLoader.css" type="text/css" />
<script type='text/javascript' src='js/queryLoader.js'></script>
Remove the jQuery part if you have already included the file.
4. Place this code at the bottom of your page:
Code
<script type='text/javascript'>
QueryLoader.init();
</script>
You are now done!
Customization:
If you only want one element / container to be preloaded you can setup a jQuery selector to only preload what you want.
Let’s say you have an element with an id. You only want the images inside that element to be preloaded. You can use the following code:
Code
<script type='text/javascript'>
QueryLoader.selectorPreload = "#idOfTheElement";
QueryLoader.init();
</script>