Поочередная загрузка картинок
 

Хочу организовать фотогалерею, где на экран выводится 500 изображений
100 на 75 со ссылкой на фото в полном размере.

На так как фото оч. много , они загружаються хаотически.

Как на js организовать последовательную загрузку?
Мож. чтобы скрипт проверял загружено ли предыдущее изображение, а потом загружал следующее.

<div id="photos"></div>

var Photos = ['photo1.jpg', 'photo2.jpg', 'test.jpeg']; //Ссылки к фотографиям

function addImg(n)
{
   var img = document.createElement('IMG');
   img.alt = '';
   img.src = Photos[n];
   img.onload = function()
   {
       addImg(n + 1);
   }
   document.getElementById('photos').appendChild(img);
}

addImg(0);

Ничего в голову не приходит кроме такого :)

Спасибо

:write:
на всякий случай
можно заменить на new Image();
и лучше
img.onload вначале потом img.src

И в конце получите ошибку. Надо делать проверку на количество элементов в массиве. if (n<Photos.length) addImg(n + 1);

Странно но код работает только в опере и ie !

ml227,
код покажите

в чём разница?

Картинка может загрузиться из кеша, и онлоад не сработает

вот оно как :blink:
то, что загрузка начинается в момент присвоения значения src, понятно
остальное - нет, так как тогда бы код ниже не работал во все разы после первого (кеш хрома показал, что картинка там)

<button id="but">load</button>
<script>
but.onclick = function () {
	var img = new Image();
	img.src = "http://javascript.ru/forum/image.php?u=19820&dateline=1334914235";
	img.onload = function () {
		alert("loaded");
	}
	document.body.appendChild(img);
}
</script>