Simple Javascript Image Slideshow

This site is best viewed in a modern browser with JavaScript enabled.

anoesis23

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:

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:

<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

MarPlo

Hi,
Try use this html code, with <script> out of Div for images:

<div id="main_img">
<noscript>
<img src="images/stream.jpg" title="Waipahihi Stream" alt="Waipahihi Stream" />
</noscript>
</div>
<script type="text/javascript"><!--
nextPic();
--></script>

xelawho

time = setTimeout(nextPic, 5000);

EdenZ

Plz check info on professional java image SDK ,http://www.rasteredge.com/java-imaging/