Web Analytics Made Easy -
StatCounter Need help with "Dynamically populating a JavaScript image slideshow" - CodingForum

Announcement

Collapse
No announcement yet.

Need help with "Dynamically populating a JavaScript image slideshow"

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Need help with "Dynamically populating a JavaScript image slideshow"

    Hi, I'm completely new to web design & php so I'm trying to follow the tutorial here which uses php to return a list of images in a folder then display them.
    However when I try implementing this on my machine (so putting the php code into one file, the javascript into a main html with some jpegs in the same folder) but I get the following errors:
    Code:
    getimages.php:1 Uncaught SyntaxError: Unexpected token <
    getimages.php:-1 Resource interpreted as Script but transferred with MIME type text/php
    The php file is as follows:
    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
    ?>
    Any help would be much appreciated!

  • #2
    The code works fine. Are you including this in another file?
    If you can't stand behind your troops, feel free to stand in front of them
    Semper Fidelis

    Comment


    • #3
      I have this in an html file in the same directory:
      Code:
      <body>
      <script src="getimages.php"></script>
      
      <script type="text/javascript">
      
      var curimg=0
      function rotateimages(){
      document.getElementById("slideshow").setAttribute("src", galleryarray[curimg])
      curimg=(curimg<galleryarray.length-1)? curimg+1 : 0
      }
      
      window.onload=function(){
      setInterval("rotateimages()", 2500)
      }
      </script>
      
      <div style="width: 170px; height: 160px">
      <img id="slideshow" src="1.jpg" />
      </div>
      </body>
      Which is taken from the tutorial website, but with the file path's changed slightly to fit what I have

      Comment

      Working...
      X