Very Simple Code to Create Photo Slideshow

Make a Slide Show and tell your story! Learn how easy it is to make a dynamic slide show with simple sample code. It is fast and easy! To create a very basic image slideshow is very simple. You can use your own pictures, photos and bellow javascript slideshow code as a sample to create image slideshow for websites easily.

Things you will need to do before hand:

1. Create a html document “sample.html”, a directory “images” under the same folder;

2. Copy or move your image files to the “images” directory.

Javascript slideshow code

Two steps to create basic photo slideshow

1.  Copy the sample slideshow code into the HEAD of your HTML document “sample.html”

—code section 1-javascript slideshow code—

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
NewImg = new Array (
"images/01.jpg",
"images/02.jpg",
"images/03.jpg"
);
var ImgNum = 0;
var ImgLength = NewImg.length - 1;
//Time delay between Slides in milliseconds
var delay = 3000;
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>

—End of javascript slideshow code -section 1—

2.  Add the last sample slideshow code into the BODY of your HTML document

—Code section 2-javascript slideshow code—-

<img src="images/01.jpg" name="slideshow">
<table>
<tr>
<td align="right"><a href="javascript:chgImg(-1)">Previous</a></td>
<td align="center"><a href="javascript:auto()">Auto/Stop</a></td>
<td align="left"><a href="javascript:chgImg(1)">Next</a></td>
</tr>
</table>

—End of javascript slideshow code- section 2—

Save the HTML page, you are done. View it in browser as bellow:

javascript image slideshow code

Now you know how easy it is to make a dynamic slide show with sample javascript slideshow code. No complex coding, no flash knowledge, no flash tools, just your pictures and photos. Now try to create a slide show and tell your story. It is easy and Fun.

If you like to make more fancy photo slideshows with Flash transition, Flash Slideshow Maker Professional is highly recommended.

Very Simple Code to Create Photo Slideshow
0 votes, 0.00 avg. rating (0% score)