Chargement des images src d'une image mappée

Bonjour,
J'ai fait un image mappée avec des zones réactives au passage de la souris (quand on passe la souris sur la zone, une autre images est affichée -> onMouseOver qui change l'image source).
Quand je teste en local, cela fonctionne plutôt bien (l'image de remplacement s'affiche rapidement), mais quand j'upload sur mon site web, les images mettent pas mal de temps à charger, au point d'être obligé de pointer la zone pendant 5/10 secondes afin que l'image de remplacement s'affiche. C'est assez embêtant car déjà que le fait qu'il y a une zone réactive à cet endroit n'est pas explicite, alors si en plus, c'est long à charger ....

Enfin bref, je cherche un moyen de précharger les images dans le cache du navigateur en même temps que la page d'accueil du site (par exemple -enfin, à l'avance en tout cas-), afin que le visiteur voie les images de remplacement tout de suite au passage de la souris.
J'ai réduit les images mais ensuite, j'ai une grosse perte en qualité, qui est préjudiciable pour le site.

Donc, je sais qu'on peut faire ça en Javascript, mais ne m'y connaissant pas trop, je ne sais pas trop par où commencer ...
J'ai aussi testé plusieurs scripts en Javascript, toujours, avec une barre de chargement et tout, mais entre celles qui sont trop compliquées, celles qui ne fonctionnent pas avec Firefox, et celles qui sont beaucoup trop complexes pour mon cas, je ne trouve rien de satisfaisant.

Alors, j'ai trouvé ce code, mais je ne suis pas convaincu du résultat :
<script language="JavaScript">
i1 = new Image();
i1.src = "images/image1.jpg";
i2 = new Image();
i2.src = "images/image2.jpg";
i3 = new Image();
i3.src = "images/image3.jpg";
//et ainsi de suite pour toutes les images à mettre en cache ...
</script>

Voilà pour mon image mappée, et j'aimerais avoir le même pricipe de préchargement mais pour des images normales, cette fois.
Parce que le truc, c'est que c'est un site pour un artiste, donc il y a beaucoup d'images, et le temps qu'elles chargent toutes, on voit des morceaux d'images par-ci par-là, et c'est plutôt moche. Dans ce cas, j'aimerais afficher un petit gif animé (de chargement) juste le temps du chargement des images, qui s'enlèverait une fois l'image en cache.

Bon voilà, je ne sais pas si c'est faisable, mais si vous avez des pistes, des astuces ou des liens à me faire partager, ils seront les bienvenus :)
Merci d'avance, donc.