Retourner ' la page d'accueil de TJSRetourner ' la page d'accueil de TJS

Script preload : Préchargement d'images dans le cache du navigateur

Préchargement d'images dans le cache du navigateur et détection de la fin du chargement
Partie II : L'interactivité
Edition 1 | Chapitre 12 : Manipuler le document / Page 192
Edition 2 | Chapitre 12 : Manipuler le document / Page 207
Edition 3 | Chapitre 12 : Manipuler le document / Page 207

Exécution du script

Emulation de la console

Code source

<html><head><title>Préchargement d'images</title><script type="text/javascript">/* Constructeur de Preload */function Preload(images, callback=null) {  this.images=[];  this.nbLoaded=0;  this.callback=callback;  for (var i=0; i<images.length; i++) {    this.images[i]=new Image();         this.images[i].src=images[i];    var thisPreload=this;  /* Sauvegarde du this dans le contexte du onload */    this.images[i].onload = function(evt) {      console.log("Image "+this.src+" loaded ");      thisPreload.nbLoaded++;      if (thisPreload.nbLoaded==thisPreload.images.length) {        /* Toutes les images sont chargées : lancement de l'éventuelle callback */        if (typeof thisPreload.callback === "function") {           thisPreload.callback();         }      }    }  }}/* Lancement du préchargement */var images=["media/image1.gif","media/image2.gif","media/image3.gif"];var preload = new Preload(images, function() { console.log("Préchargement terminé"); document.getElementById("end").innerHTML="Préchargement terminé";});</script></head><body>  <h1>Préchargement d'images avec détection de fin de chargement</h1>  <div id="end"></div></body></html>

Troisième édition Tout JavaScript chez Dunod

Tout JavaScript le livre chez DunodEn savoir plus
Sortie le 4 janvier 2023

Version papier 29€90
Format électronique 22€99.

Commandez en ligne

Chercher une fonction, un objet, ...

Le graph des objets JavaScript



Chargement
en cours...
Le 16/04/2024 21:43:02 sur php 7 en 76.38 ms