www.webdeveloper.com
Results 1 to 4 of 4

Thread: Simple Javascript Image Slideshow

  1. #1
    Join Date
    May 2012
    Posts
    1

    Simple Javascript Image Slideshow

    I am trying to create a simple image slideshow type thing with the Javascript code below, but it is not displaying in my page.
    The JavaScript:
    Code:
    var waiPics = [];
    waiPics[0] = 'images/path.jpg';
    waiPics[1] = 'images/gorse.jpg';
    waiPics[2] = 'images/stream.jpg';
    waiPics[3] = 'images/pines.jpg';
    waiPics[4] = 'images/stump.jpg';
    
    var picNum = 0;
    var picDiv = document.getElementById("main_img");
    var time;
    
    function nextPic() {
    	if (picNum === waiPics.length) {
    		picNum = 0;
    	} else {
    		picNum += 1;
    	}
    	picDiv.innerHTML = '<img src="' + waiPics[picNum] + '" title="Waipahihi" alt="Waipahihi">';
        time = setTimeout(nextPic(), 5000);
    }
    The HTML:
    Code:
    <div id="main_image">
    <script type="text/javascript">
    <!-- Begin
    nextPic();
    //  End -->
    </script>
    <noscript>
    <img src="images/stream.jpg" title="Waipahihi Stream" alt="Waipahihi Stream" />
    </noscript>
    </div>
    Thanks in advance

  2. #2
    Join Date
    Feb 2011
    Posts
    231
    Hi,
    Try use this html code, with <script> out of Div for images:
    Code:
    <div id="main_img">
    <noscript>
    <img src="images/stream.jpg" title="Waipahihi Stream" alt="Waipahihi Stream" />
    </noscript>
    </div>
    <script type="text/javascript"><!--
    nextPic();
    --></script>

  3. #3
    Join Date
    Nov 2010
    Posts
    1,090
    Code:
    time = setTimeout(nextPic, 5000);

  4. #4
    Join Date
    Apr 2013
    Posts
    7
    Plz check info on professional java image SDK ,http://www.rasteredge.com/java-imaging/

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles