How To Create A SlideShow Gallery

Hello once again,

This tutorial will help you create a gallery for pictures, and you can use it for a slideshow,

Code:

<script language="javascript">

<!--start
var x = 0;

function rotate(num){
x=num%document.slideForm.slide.length;
if(x<0){x=document.slideForm.slide.length-1};
document.images.show.src=document.slideForm.slide.options[x].value;
document.slideForm.slide.selectedIndex=x;
}

function apRotate() {
if(document.slideForm.slidebutton.value == "Stop"){
rotate(++x);window.setTimeout("apRotate()", 5000);}
}
//end -->
</script>

<form name="slideForm">
<table cellspacing=1 cellpadding=4 style="border:1px black solid; border-collapse:collapse">
<tr>
<td align=center>
<b>My Gallery</b>
</td>
</tr>
<tr>
<td align=center width=350 height=300>
<img src="http://i85.servimg.com/u/f85/13/15/52/99/no_pic10.gif" name="show">
</td>
</tr>

<tr><td align=center style="border:1px black solid;"><strong>Author :</strong>
<select name="slide" onChange="rotate(this.selectedIndex);">
<option value="URL OF IMAGE HERE" selected>Author's Name
<option value="URL OF IMAGE HERE">Author's Name
<option value="URL OF IMAGE HERE">Author's Name
<option value="URL OF IMAGE HERE">Author's Name
<option value="URL OF IMAGE HERE">Author's Name
<option value="URL OF IMAGE HERE">Author's Name
<option value="URL OF IMAGE HERE">Author's Name
<option value="URL OF IMAGE HERE">Author's Name
</select>
</td>
</tr>
<tr>
<td align=center style="border:1px black solid;">
<input type=button onclick="rotate(0);" value="|&lt;&lt;" title="Jump to beginning" style="border:1px black solid;">
<input type=button onclick="rotate(x-1);" value="&lt;&lt;" title="Last Picture" style="border:1px black solid;">
<input type=button name="slidebutton" onClick="this.value=((this.value=='Stop')?'Start':'Stop');apRotate();" value="SlideShow" title="Autoplay" style="width:75px; border:1px black solid;">
<input type=button onclick="rotate(x+1);" value="&gt;&gt;" title="Next Picture" style="border:1px black solid;">
<input type=button onclick="rotate(this.form.slide.length-1);" value="&gt;&gt;|" title="Jump to end" style="border:1px black solid;">
</td>
</tr>
</table>
</form>

To add your images, modify the code :
Find :

<option value="URL OF IMAGE HERE">Author's Name

You can modify those fields, and use them to display your image, or the author's name.
You can also add more of these if your running out of space to use as pictures in the gallery,

Enjoy now,

Note : You can modify this picture that you get if there are no pictures that you are previewing.

Image :

This is just a sample image from my nintendo gaming forum,