Fonction de préchargement des images?

Question

Je préchargement avec succès une image sur mon site avec ce JavaScript:

loveHover = new Image(); 
loveHover.src = "http://mypage.com/images/love-hover.png"; 

Est-il facile d'une bonne façon d'emballer cette chose dans une fonction? Quelque chose comme:

function preloadImage(image) { 
    var image = new Image(); 
    var path = "http://mypage.com/images/"; 
    image.src = path + image; 
} 

Answer 1

["love-hover.jpg", "like-hover.jpg", "hate-hover.jpg"].forEach(function(img) 
{ 
    new Image().src = "http://mypage.com/" + img; 
}); 

Pour que cela fonctionne dans Versions IE antérieures à 9, voir le Array.forEach Compatibility section pour les instructions.

Answer 2

Avez-vous essayé de ne pas utiliser javascript?

http://perishablepress.com/press/2008/06/14/a-way-to-preload-images-without-javascript-that-is-so-much-better/

Answer 3

Eh bien la partie unique de la fonction serait src (lien vers l'image). Alors faites cela l'argument.

function preloadImage(src) { 
    var image = new Image(); 
    image.src = src; 
} 

Ensuite, si vous avez plusieurs urls les stocker dans un tableau:

var imageSrcs = [ 
    "http://mypage.com/images/love-hover.png#", 
    "http://mypage.com/images/love-hover2.png", 
    "http://mypage.com/images/love-hover3.png" 
]; 

et précharger les images avec une boucle:

for (var i = 0; i < imageSrcs.lengthl i++) 
    preloadImage(imageSrcs[i]);