Posted by Vincent van Beveren on 07/06/06 09:14

There is no way to do this by setting some default browser behavour.

Every image tag has an onload handler. You can use this to start loading
the next image. For example:

<img id="img1" src="firstImage.jpg" onload="loaded(this.id);">
<img id="img2" src="empty.gif" onload="loaded(this);">
<img id="img3" src="empty.gif" onload="loaded(this);">

elsewhere:

<script type="text/javascript">

var srcs = {
img1 : 'one.jpg',
img2 : 'two.jpg',
img3 : 'three.jpg'
}

function loaded(img) {
if (img.src.indexOf('empty.gif') {
return; // ignore empty
}
nextImgId = ímg' + (parseInt(img.id) + 1);
nextImg = document.getElementById(nextImgId);
nextImg.src = srcs[nextImgId];
}

</script>

Somthing like that

Vincent

Chris Tomlinson wrote:
> Hi, is there any way to specify the sequence in which images load on a web
> page?
>
> More specifically, here is what we need to achieve:
>
> Image1 starts loading first and the browser does not continue through the
> HTML until Image1 has loaded COMPLETELY. When Image1 is done, Image2 BEGINS
> loading. When Image2 is 100% done, only then does Image 3 begin... and so
> on...
>
> Anyone able to offer a way to do this? Some sort of browser "Pause" command
> is the ideal solution, which would pause the loading of HTML until the
> current command has completed, and THEN move on to the next 'chunk' of HTML.

[Back to original message]