Create Preload Images with jQuery

Submitted by:Jhon Brain

Date added:07 March, 2013

Category:jQuery

Example shown here how to preload the images with jquery in WordPress.

Tags: preload images

Code Snippet:

<script type="text/javascript">

jQuery(function () {
jQuery('.post-thumbnail-title img').hide(); //hide all the images on the page
});

var i = 0; //initialize
var int=0; //Internet Explorer Fix
jQuery(window).bind("load", function() { //The load event will only fire if the entire page or document is fully loaded
var int = setInterval("doThis(i)",500); //500 is the fade in speed in milliseconds
});

function doThis() {
var imgs = jQuery('.post-thumbnail-title img').length; //count the number of images on the page
if (i >= imgs) { //Loop the images
clearInterval(int); //When it reaches the last image the loop ends
}
jQuery('img:hidden').eq(0).fadeIn(500); //fades in the hidden images one by one
i++; //add 1 to the count
}
</script>
 
 

Comments