Toutela - Le site des Internautes

Lorsqu'on fait un rollover, au passage de la souris, le navigateur doit soudainement télécharger une nouvelle image. Cela provoque bien souvent une image absente qui se charge au bout d'un certain temps, suivant la rapidité de connexion. Pour éviter cette attente, il suffit de demander au navigateur de charger toutes les images qui lui seront nécessaires avant qu'il en ait besoin.
D'où l'utilité d'une fonction de 'préchargement des images'.

Exemple :

Le code :

Entre <HEAD> et </HEAD> :

// Si toutes les images ont la même extension
// L'extension de toutes les images
var ext = ".gif";

// Si toutes les images sont dans le même répertoire et ont la même extension
// Le nom de chaque image à précharger, peu importe l'ordre
var liste_images = new Array('photo_on','visuel1_on','visuel2_on','logo_on','animation_on');

// Si les images sont dans des répertoires différents ou ont des extensions différentes, indiquer dans le tableau précédent le chemin et l'extension de chaque image

// Un tableau qui permettra le stockage 'virtuel' des images pour les précharger
document.image_chargee = new Array();

// La fonction de préchargement
function prechargement() {

// Pour chaque image
for ( i = 0; i < liste_images.length; i++ ) {

// on créé virtuellement une image
document.image_chargee[i] = new Image;

// On en indique la source en assemblant le chemin, le nom et l'extension
document.image_chargee[i].src = chemin + liste_images[i] + ext;

//Si les images sont dans des répertoires différents ou ont des extensions différentes, ne pas mettre 'chemin + liste_images[i] + extension' mais uniquement les variables nécessaires
}
}
// Et le navigateur place dans son cache toutes les images !!

</script>

Entre <BODY> et </BODY> :

Newsletter

Toutela