Notification de rendu d'image HTML

Question

Dans une page Web, j'ai une grande image à charger et d'autres contenus. Parfois, l'image prend plus de temps à charger et je voudrais suivre cela. Y at-il un moyen par lequel je peux être averti en utilisant Javascript lorsque le navigateur rend complètement l'image?

EDIT

J'utilise le code suivant pour charger l'image.

<table border="0" style="background-image: url(http://abc.com/abc.jpg);" id="imageDisp"> 
</table> 

un peu plus ACTUALISATION
est-il un moyen simple de savoir combien de temps l'image se rendre? Utilisation du javascript Je reçois une notification que l'image est chargée maintenant, est-il un moyen de savoir quand le chargement de l'image a commencé? Alors que le temps écoulé peut être calculé?

Answer 1

Vous pouvez accrocher sur l'événement load de l'élément <img>. Par exemple.

<img src="http://upload.wikimedia.org/wikipedia/commons/3/31/Atlantic_hurricane_tracks.jpg" 
    onload="alert('finished!');"> 

Jsfiddle demo.

---

Mise à jour:

Ensuite, créez new Image() à la place (le navigateur moyen est assez intelligent pour ne pas demander la même image deux fois et plusieurs références pointeront à la même demande d'image):

<script> 
    var img = new Image(); 
    img.src = 'http://upload.wikimedia.org/wikipedia/commons/3/31/Atlantic_hurricane_tracks.jpg'; 
    img.onload = function() { 
     alert('finished!'); 
    } 
</script> 

Another jsfiddle demo (ne pas oublier d'effacer le cache du navigateur, la même image peut être déjà mise en cache :)).

Dernière question

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 Questions connexes

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.