http://www.javascriptkit.com/javatutors ... php2.shtml
Insert this php code in notepad and save the page as: getimages.php
Code: Select all
<?
//PHP SCRIPT: getimages.php
Header("content-type: application/x-javascript");
//This function gets the file names of all images in the current directory
//and ouputs them as a JavaScript array
function returnimages($dirname=".") {
$pattern="(\.jpg$)|(\.png$)|(\.jpeg$)|(\.gif$)"; //valid image extensions
$files = array();
$curimage=0;
if($handle = opendir($dirname)) {
while(false !== ($file = readdir($handle))){
if(eregi($pattern, $file)){ //if this file is a valid image
//Output it as a JavaScript array element
echo 'galleryarray['.$curimage.']="'.$file .'";';
$curimage++;
}
}
closedir($handle);
}
return($files);
}
echo 'var galleryarray=new Array();'; //Define array in JavaScript
returnimages() //Output the array elements containing the image file names
?> Make a folder with the name:pics on your server.
Upload your images and the page getimages.php into the folder pics
===============================================
Insert the codes below in the html or php page where you like to see the slideshow.(any page you like)
Insert this code in: page html--> between the head tags.
Code: Select all
<script src="pics/getimages.php"></script>
<script type="text/javascript">
var curimg=0
function rotateimages(){
document.getElementById("slideshow").setAttribute("src", "pics/"+galleryarray[curimg])
curimg=(curimg<galleryarray.length-1)? curimg+1 : 0
}
window.onload=function(){
setInterval("rotateimages()", 2500)
}
</script>===============================================
Insert this code in HTML object and draw the HTML object to the size of your images.
Change image1.jpg with the name from your first image.
Code: Select all
<img id="slideshow" src="pics/image1.jpg" />Thats it
The only thing you have todo is upload more images to the folder pics.
