Jquery img préchargement ne fonctionne pas dans FireFox

Question

J'ai récemment fait un petit fragment jQuery qui me permet de montrer un chargement img jusqu'à ce que l'image réelle est chargée.

L'extrait semble fonctionner dans Safari, Chrome mais pas dans FireFox. FireFox affiche uniquement un loading alt et ne bascule jamais vers l'image chargée.

Voici l'extrait

var loading = $('<img src="/media/ajax-loader.gif" alt="loading" />'); 
    $('.thumbnail').each(function(){ 
     var loadIMG = loading.clone(); 
      $(this).after(loadIMG).load(function(){ 
       $(this).fadeIn('fast'); 
       loadIMG.hide(); 
     }).hide(); 
    }); 

Toutes les idées pourquoi?

Answer 1

Vous n'avez pas dit ce qui se passe exactement sur FF mais ci-dessous peut être l'un des problèmes. De jquery documentation

Il est possible que l'événement de chargement ne sera pas déclenchée si l'image est chargée depuis le cache du navigateur. Pour compte de cette possibilité, nous pouvons utiliser un événement de charge spéciale qui déclenche immédiatement si l'image est prête. event.special.load est actuellement disponible en tant que plugin.

Voici le link pour le plugin.

Edit:

Sur la base des commentaires de l'événement de charge, essayez ci-dessous:

$('.thumbnail').each(function(){ 
     var loadIMG = loading.clone(); 
      $(this).after(loadIMG).load(function(){ 
       $(this).fadeIn('fast'); 
       loadIMG.hide(); 
     }).hide(); 
     if (this.complete) $(this).trigger("load"); 
}); 

Bien sûr, le plug-in semble être faire même chose avec la manipulation d'autres scénarios ainsi que.