Image Loop

Salchester · 08-28-2006, 10:13 AM

Upon achieving the following code to display images from a folder, in ascending order of number. is there anyway to display all images in the folder upon the page loading? As at the moment this can only be done through a button being clicked.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body onload="show()">
<script type="text/javascript">
var images = new Array();
var path = "media/";
var filename = 0;

function show()
{
  images[images.length]='<a href="'+path+filename+'.wmv"</a><img src="'+path+filename+'.jpg">'
  document.getElementById('pictures').innerHTML=images
  filename++;
}

</script>
<input type="submit" name="Submit" onclick="show()" value="Submit">
<div style="color=white;" id="pictures"></div>
</body>
</html>

Many Thanks,

teknomage1 · 08-28-2006, 12:07 PM

Don't you have to define show() before you use it in the onload statement?

Salchester · 08-28-2006, 12:44 PM

I have done this, the first image gets displayed, but is there anyway i can make a loop to make the rest of the image in the folder appear for example: image 1 and above.

Many Thanks,

teknomage1 · 08-28-2006, 05:18 PM

Code:

function show()
{
  for( var i = 0; i < images.length; i++ ){
    images[i]='<a href="'+path+filename+'.wmv"</a><imgsrc="'+path+filename+'.jpg">'
    document.getElementById('pictures').innerHTML=images
  }
}

teknomage1 · 08-28-2006, 06:02 PM

I should have read the rest of your code, looks like the loop init should actually read

Code:

for (var i = 0; i < numImages; i++){
    images[i]='<a href="'+path+filename+'.wmv"</a><imgsrc="'+path+filename+'.jpg">'
    document.getElementById('pictures').innerHTML=images;
  filename++;
}

Salchester · 08-28-2006, 11:52 PM

teknomage1,

The code you sent me doen't work, is it due to the fact that image.length is always equal to filename (number of images being displayed, starting @ zero).

How can i change it so filename is one step behind images.length until all images within the folder have been displayed.

Many Thanks,

Salchester · 08-28-2006, 11:53 PM

teknomage1,

The code you sent me doen't work, is it due to the fact that image.length is always equal to filename (number of images being displayed, starting @ zero).

How can it be changed so filename is one step behind images.length until all images within the folder have been displayed.

Many Thanks,

redhead · 08-29-2006, 06:38 AM

you can't, because the images you're trying to load is placed server-side, and the script running to decide how many images you have is located client side..
So it will only know of the one image at hand, not how many there might be available.

teknomage1 · 08-29-2006, 12:25 PM

redhead's correct, maybe you should switch to a serrver side language, such as php or perl. Alternatively if you wish to continue down this road, maybe you should make a text entry box, so you can tell it how many images to load.