JQuery img preload не работает в FireFox

Question

Недавно я сделал небольшой фрагмент jQuery, который позволяет мне показывать загрузку img до загрузки реального изображения.

Фрагмент, кажется, работает в Safari, Chrome, но не FireFox.

FireFox отображает только loading alt и никогда не переключается на загруженное изображение.

Вот фрагмент

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(); 
    }); 

Любые идеи, почему?

Answer 1

Вы не сказали, что именно происходит на FF, но ниже может быть одной из проблем. Из jquery documentation

Вполне возможно, что событие загрузки не будет срабатывать, если изображение загружается из кэша браузера. Для учтите эту возможность, мы можем использовать специальное событие нагрузки, которое запускает сразу, если изображение будет готово. event.special.load в настоящее время доступен как плагин.

Вот link для плагина.

Edit:

На основе замечаний события нагрузки, попробуйте ниже:

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

Конечно, плагин, кажется, делает то же самое вместе с обработкой некоторых других сценариев, а также.