Thursday, 23 June 2011

Make a Simple Image Slide Show in JavaScript

We can make a simple Image Slider in JavaScript.
Just  Create a simple HTML page using this code and view the result.

<title>Simple Slide</title>
<script language="javascript">
// make a array of images and pass the location of every image.
var myPix = new Array("images/1.jpg", "images/2.jpg", "images/3.jpg");
var thisPic = 0;
function goPrevious() {
     if (document.images && thisPic > 0) {
          document.myPicture.src = myPix[thisPic];
function goNext() {
     if (document.images && thisPic < 2) {
          document.myPicture.src = myPix[thisPic];
<img src="images/0.jpg" name="myPicture"><br>
<a href="javascript:goPrevious()">Previous</a>
<a href="javascript:goNext()">Next</a>

When you test it in your browser yow will see something like this:

No comments:

Post a Comment