JavaScript Tutorial JavaScript Examples JQuery Tutorial CSS Tutorial HTML Tutorial About Us

Slideshow


This JavaScript created a mannual slideshow where the user can click the buttons to view the slides. In this exammple, we created a function ShowSlides() to display the images when the user clicks the buttons. Besides that, we also create an array of 4 images using the statement. In addition, we use the if keyword to control the slides.



The script is as follows:

<script language="Javascript">
MySlides=new Array('banner1.jpg','banner2.jpg','banner3.jpg','banner4.jpg')
Slide=0
function ShowSlides(SlideNumber){
{ Slide=Slide+SlideNumber
  if (Slide>MySlides.length-1){
  Slide=0
  }
  if (Slide<0) {
  Slide=MySlides.length-1
  }
  document.DisplaySlide.src=MySlides[Slide] 
  }
  }
  </script>
  </head><
<input type="button" value="Back" onclick="ShowSlides(-1)">
<input type="button" value="Forward" onclick="ShowSlides(1)">

The slideshow in action




Copyright©2008 Dr.Liew Voon Kiong. All rights reserved |Contact|Privacy Policy