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
    411
    Thanks
    10
    Thanked 61 Times in 60 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
    •