Détecter le chargement complet d'une image avec JavaScript

"imgReady" est une fonction JavaScript qui permet d'exécuter un code lorsqu'une image est chargée.

Le premier argument correspond à l'image pour laquelle vérifier l'état complet du chargement, tandis que le deuxième argument correspond à une fonction à exécuter le cas échéant.

function imgReady(a, b) {
  var i = null,
    f = function() {
      if (a.complete || (a.readyState === 4) || (a.readyState === 'complete')) {
        clearInterval(i);
        b(a);
        return !0;
      }
      return !1;
  };
  if (!f()) {
    i = setInterval(function() {
      f();
    }, 150);
  }
}

Voici un exemple d'utilisation de "imgReady" :

var img = document.getElementsById('img');
var imgLoaded = function() {
  console.log('Image chargée');
};
imgReady(img, imgLoaded);

Cet article vous a-t-il été utile ?

Super :)
Merci d'avoir donné votre avis !

Oups :(
Merci d'avoir donné votre avis qui va nous permettre de nous améliorer !

^