Home/ Questions/Q 6723451
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T09:34:12+00:00

I have a simple HTML page that when is load runs a javascript code

  • 0

I have a simple HTML page that when is load runs a javascript code that makes a preload of a numbers of images. When all images are loaded the java script show the result: a simple timelapse/slideshow make with the images:

that’s the code:

<HTML>
<HEAD>
<TITLE>Video</TITLE>
</HEAD>
<BODY  BGCOLOR="#000000">
<img name="foto">
<SCRIPT LANGUAGE="JavaScript">
var Pic = new Array();

Pic[0] = '/images/image1.jpg'
Pic[1] = '/images/image2.jpg'
Pic[2] = '/images/image3.jpg'
//this part in real code is replaced with a PHP script that print image location dinamically

var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
//all images are loaded on client
index = 0;
function update(){
if (preLoad[index]!= null){
document.images['foto'].src = preLoad[index].src;
index++;
setTimeout(update, 1000);
}

}
update();

</script>

</BODY>
</HTML>

My question is: how can i put an image that can it be show before the script end?
Is there a way to do it?
Is possible to print somewhere in the page the current number of image loaded in the script?
Thanx

P.S. all my test don’t give me any positive feedbak: each thing i put on html page will be shown after scripts end…

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Launch the code on the onLoad event and add a src to your empty image tag:

    <img name="foto" src="/images/image0.jpg">

    This will load image0 at the beggining.

    <HTML>
<HEAD>
<TITLE>Video</TITLE>
</HEAD>
<BODY  BGCOLOR="#000000" onLoad="preload()">
<img name="foto">
<SCRIPT LANGUAGE="JavaScript">
preLoad[i] = new Image();

function preload() {
var Pic = new Array();

Pic[0] = '/images/image1.jpg'
Pic[1] = '/images/image2.jpg'
Pic[2] = '/images/image3.jpg'
//this part in real code is replaced with a PHP script that print image location dinamically

var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i].src = Pic[i];
}
}

//all images are loaded on client
index = 0;
function update(){
if (preLoad[index]!= null){
document.images['foto'].src = preLoad[index].src;
index++;
setTimeout(update, 1000);
}

}
update();

</script>

</BODY>
</HTML>

    To add a counter, in the main loop write a string to the document with the i value, for example..

    • 0