Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Feb 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    need help on dynamic image slideshow

    I created a php and some javascript from code I found on this site. The problem is, I am not getting a slide show - only the first picture. I need to be able to slideshow everything in the Images folder - without detailing image names....
    Here's what I have - I think I'm missing something simple:
    In the Images folder I have getimages.php:
    Code:
    <?
    //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
    ?>

    In my page, I put these in the <head> section:
    Code:
    <script src="Images/getimages.php"></script>
    <script type="text/javascript">
    
    var curimg=0
    function rotateimages(){
    document.getElementById("slideshow").setAttribute("src", "Images/"+galleryarray[curimg])
    curimg=(curimg<galleryarray.length-1)? curimg+1 : 0
    }
    
    window.onload=function(){
    setInterval("rotateimages()", 2500)
    }
    </script>
    
    
    
    Then, in the body where I want the slideshow I have:
    <div style="width: 170px; height: 160px">
    <img id="slideshow" src="Images/beer.jpg" />
    </div>
    Last edited by michelleg; 02-10-2010 at 08:56 PM. Reason: code tages

  • #2
    Regular Coder hdewantara's Avatar
    Join Date
    Aug 2009
    Location
    Jakarta, Indonesia.
    Posts
    354
    Thanks
    9
    Thanked 52 Times in 51 Posts
    Let's check whether your galleryarray trully holds all the images.
    Add a few lines into your html page, after slideshow div container:
    PHP Code:
    <script type="text/javascript">
    if (
    galleryarray.length==0){
      
    window.alert("galleryarray has zero length");
    }
    else{
      var 
    a="galleryarray:";
      for (var 
    i=0i<galleryarray.lengthi++){
        
    a+="\n["+i+"] = "+galleryarray[i];
      }
      
    window.alert(a);
    }
    </script> 
    If this galleryarray has zero length then there must be something
    with your javascript include.

    Add type="text/javascript" into that, so it will be
    PHP Code:
    <script type="text/javascript" src="Images/getimages.php"></script> 
    and retry.
    Last edited by hdewantara; 02-14-2010 at 08:13 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •