Предварительная загрузка изображения для всех изображений

Question

Я пытаюсь добавить предварительное изображение для всех изображений с помощью метода jQuery load(). В моем php-документе я прочитал папку с изображением и создаю элемент foreach img-tag.

Что-то вроде этого:

$myimages = opendir("img/"); 
$gallery = array(); 
while($myimage = readdir($myimages)) 
{ 
if($myimage != '.' AND $myimage != '..') 
{ 
    $gallery[] = $image; 
} 
} 

sort($gallery); 

foreach ($gallery as $image) { 
    echo '<div><img src="img/'.$image.'" id="preload"/></div>'; 
} 

closedir($myimages); 

Теперь я хочу, чтобы отобразить «вращатель-изображение» сезам изображения загружается. Каждая попытка с window.load или jQuery load не работает для меня.

Может ли кто-нибудь объяснить мне, что я должен делать?

Благодарим за помощь!

// редактировать //

Если я использую дополнительный div в html он прекрасно работает.

Answer 1

вы могли preloadImages с JavaScript

function preloadImages(array) { 
if (!preloadImages.list) { 
    preloadImages.list = []; 
} 
var list = preloadImages.list; 
for (var i = 0; i < array.length; i++) { 
    var img = new Image(); 
    img.onload = function() { 
     var index = list.indexOf(this); 
     if (index !== -1) { 
      // remove image from the array once it's loaded 
      // for memory consumption reasons 
      list.splice(index, 1); 
     } 
    }; 
    list.push(img); 
    img.src = array[i]; 
} 

}