0 Replies Latest reply on Mar 12, 2010 12:05 PM by mmrdesigner

    How can I add Autoplay function to my javascript slideshow?

    mmrdesigner

      Hi,

      I'd like to have this slideshow automatically play (rather than having to click "play/stop")

      on my website: http://www.logicadesign.com (click "Slideshow 09" on left to view).

      Is there a line of code I can add to the code below?
      Thanks!

      Molly

       

      <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
      <title>Untitled Document</title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      <link href="logica.css" rel="stylesheet" type="text/css">
      <SCRIPT LANGUAGE="JavaScript">
      <!-- Begin
      NewImg = new Array (
      "NewWork09/1.jpg",
      "NewWork09/2.jpg",
      "NewWork09/3.jpg",
      "NewWork09/4.jpg",
      "NewWork09/5.jpg",
      "NewWork09/6.jpg",
      "NewWork09/7.jpg",
      "NewWork09/8.jpg",
      "NewWork09/9.jpg",
      "NewWork09/10.jpg",
      "NewWork09/11.jpg",
      "NewWork09/12.jpg",
      "NewWork09/13.jpg",
      "NewWork09/14.jpg",
      "NewWork09/15.jpg",
      "NewWork09/16.jpg",
      "NewWork09/17.jpg",
      "NewWork09/18.jpg",
      "NewWork09/19.jpg",
      "NewWork09/20.jpg",
      "NewWork09/21.jpg",
      "NewWork09/22.jpg",
      "NewWork09/23.jpg",
      "NewWork09/24.jpg",
      "NewWork09/25.jpg",
      "NewWork09/26.jpg",
      "NewWork09/27.jpg",
      "NewWork09/28.jpg",
      "NewWork09/29.jpg",
      "NewWork09/30.jpg",
      "NewWork09/31.jpg",
      "NewWork09/32.jpg",
      "NewWork09/33.jpg",
      "NewWork09/34.jpg",
      "NewWork09/35.jpg",
      "NewWork09/36.jpg",
      "NewWork09/37.jpg",
      "NewWork09/38.jpg",
      "NewWork09/39.jpg",
      "NewWork09/40.jpg",
      "NewWork09/41.jpg",
      "NewWork09/42.jpg",
      "NewWork09/43.jpg",
      "NewWork09/44.jpg",
      "NewWork09/45.jpg",
      "NewWork09/46.jpg",
      "NewWork09/47.jpg",
      "NewWork09/48.jpg",
      "NewWork09/49.jpg",
      "NewWork09/50.jpg",
      "NewWork09/51.jpg",
      "NewWork09/52.jpg",
      "NewWork09/53.jpg",
      "NewWork09/54.jpg",
      "NewWork09/55.jpg",
      "NewWork09/56.jpg",
      "NewWork09/57.jpg",
      "NewWork09/58.jpg",
      "NewWork09/59.jpg",
      "NewWork09/60.jpg",
      "NewWork09/61.jpg",
      "NewWork09/62.jpg",
      "NewWork09/63.jpg",
      "NewWork09/64.jpg",
      "NewWork09/65.jpg",
      "NewWork09/66.jpg",
      "NewWork09/67.jpg",
      "NewWork09/68.jpg",
      "NewWork09/69.jpg"
      );
      var ImgNum = 0;
      var ImgLength = NewImg.length - 1;
      
      //Time delay between Slides in milliseconds
      var delay = 2500;
      
      var lock = false;
      var run;
      function chgImg(direction) {
      if (document.images) {
      ImgNum = ImgNum + direction;
      if (ImgNum > ImgLength) {
      ImgNum = 0;
      }
      if (ImgNum < 0) {
      ImgNum = ImgLength;
      }
      document.slideshow.src = NewImg[ImgNum];
         }
      }
      function auto() {
      if (lock == true) {
      lock = false;
      window.clearInterval(run);
      }
      else if (lock == false) {
      lock = true;
      run = setInterval("chgImg(1)", delay);
         }
      }
      //  End -->
      </script>
      </head>
      <body>
      <table width="648" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td width="648" height="20" align="left" valign="baseline" nowrap><a href="javascript:chgImg(-1)" class="text">Prev</a> <span class="text">|</span> <a href="javascript:auto()" class="textgreen">Play/Stop</a> <span class="text">|</span> <a href="javascript:chgImg(1)" class="text">Next</a></td>
        </tr>
        <tr>
          <td height="10" align="left" valign="top" nowrap></td>
        </tr> 
        <tr>
        <td height="486" align="left" valign="top" nowrap><img src="NewWork09/1.jpg" name="slideshow" width="648" height="487"></td>  
        </tr>
      </table>
      </body>
      </html>