Image display that will change for every 5 sec.

**Erwin Moller** · Sep 30 '05, 02:35 PM

Re: Image display that will change for every 5 sec.

Faree wrote:
[color=blue]
> Hi all,
>
> can any one come up with the code that display the images from the
> folder.but image should be changed for every 5 seconds.can any one com
> with this code. or suggest me the way to do it.quick reply will be
> appreciated.
>
> thanks in Advance.[/color]

Hi,

I think the most simple approach is a combination with Javascript and PHP.
Try something like this:
1) scan your directory with images
2) produce html that contains the javascript to loop over the images.

You'll end up with something like this:
(not tested, just some code to get you going)

<html>
<head>
<script type="text/javascript">

// fill the array imagenames from PHP
// by scanning the filenames in the directory.
// Have a look at: http://nl2.php.net/manual/en/function.readdir.php
// for some examplecode

var imagenames = ["mrJoe.jpg" , "ZaphodBreebleb rox.gif", "Marvin.png "];
var baseImageURL = "http://www.yoursite.co m/images/";
var imgcount = -1;
var nrOfImages = imagenames.leng th;
nextimage();

function nextImage(){
imgcount++;
if(imgcount > nrOfImages) {
imgcount = 0;
}
// make full URL to image
var newImageSrc = baseImageURL + imagenames[imgcount];
// set the new Image
document.images .myImage.src=ne wImageSrc;
// Come back here in 5 seconds
setTimeout("nex tImage()" , 5000);
}
</script>

</head>
<body>
<img scr="" name="myImage">
</body>
</html>

Good luck.

Regards,
Erwin Moller

Image display that will change for every 5 sec.

Image display that will change for every 5 sec.

Comment