PDA

View Full Version : Load different, sequential images each time page loads



vkbarefoot
03-25-2007, 06:15 AM
Load Different Image each time Page Loads

I have the script on how to randomly load a different image on page load but my client wants them to be sequential. I would please like to know how to tweek the random script to load sequential images.

Thank you ... viki

vkbarefoot
03-25-2007, 06:22 AM
Sorry .. that would be the script written by codeexploiter and submitted in response to a question posted by chanduroo on Feb 20, 2007.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#image
{
width:760px;
border: 1px solid #000;
height:auto; /*You can use a predefined height here if you can have images with the similar height;*/
}

</style>
<script type="text/javascript">
//The array which is going to hold the image information. Store the image info along with their correct path; I've omitted the path here as I've stored the images in the same folder where my web page resides.
var imageArray = new Array();

imageArray[0] = "1.jpg"; //You can replace these image file names with your own image names.
imageArray[1] = "2.jpg";
imageArray[2] = "3.jpg";
imageArray[3] = "4.jpg";
function doIt()
{
var rand = Math.floor(Math.random()*4); //Generating a random number between 0 and 3 here in your case you can replace 4 with 11 if you have 10 images

var imgPath = "<img src='"+imageArray[rand]+"' alt='heder' border='0' align='absmiddle' />";

document.getElementById("image").innerHTML = imgPath;

}
</script>
</head>

<body>
<div id="image"></div>
<script type="text/javascript">
doIt();
</script>
<br>
<br>
<br>
Other texts
</body>
</html>

vkbarefoot
03-25-2007, 06:23 AM
Sorry .. that would be the script written by codeexploiter and submitted in response to a question posted by chanduroo on Feb 20, 2007.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#image
{
width:760px;
border: 1px solid #000;
height:auto; /*You can use a predefined height here if you can have images with the similar height;*/
}

</style>
<script type="text/javascript">
//The array which is going to hold the image information. Store the image info along with their correct path; I've omitted the path here as I've stored the images in the same folder where my web page resides.
var imageArray = new Array();

imageArray[0] = "1.jpg"; //You can replace these image file names with your own image names.
imageArray[1] = "2.jpg";
imageArray[2] = "3.jpg";
imageArray[3] = "4.jpg";
function doIt()
{
var rand = Math.floor(Math.random()*4); //Generating a random number between 0 and 3 here in your case you can replace 4 with 11 if you have 10 images

var imgPath = "<img src='"+imageArray[rand]+"' alt='heder' border='0' align='absmiddle' />";

document.getElementById("image").innerHTML = imgPath;

}
</script>
</head>

<body>
<div id="image"></div>
<script type="text/javascript">
doIt();
</script>
<br>
<br>
<br>
Other texts
</body>
</html>