Preloading images with jQuery

Posted on May 17, 2012 by Благомир Иванов

$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}
 
$(['img1.jpg','img2.jpg','img3.jpg']).preload();

For simple JavaScript use:

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
    });
}
 
preload([
    'img/1.jpg',
    'img/2.png',
    'img/3.gif'
]);