Need advise with this script

[ltrue]

I am not an expert at all so please be patient. I've volunteered to help a youth sports organization with their website. The code below does work but I would like it just to scroll through the images with out needing the onClick event to happen. I just want it to start scrolling right away - what am I missing?

<script type="text/javascript">

var x=0;

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

function auto() {
if(document.ff.fa.value == "Stop"){
rotate(++x);setTimeout("auto()", 2000);}}
</script>

<form name="ff">
<table cellpadding="3" style="border:1px black solid;border-collapse:collapse;">
<tr><th align=center></th></tr>

<tr><td align=center>
<img src="http://cdn.ngin.com/attachments/photo/0500/8763/th_action_medium.jpg" name="show">
</td></tr>

<tr><td align=center style="border:1px black solid;">
<select name="slide" onChange="rotate(this.selectedIndex);">
<option value="http://cdn.ngin.com/attachments/photo/0500/8763/th_action_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8768/th_goals_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8782/th_hits_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8788/th_saves_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8793/th_skill_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8798/th_speed_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8803/th_teamwork_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8813/th_thunder_medium.jpg"></option>
</select>
</td></tr>

<tr><td align=center style="border:1px black solid;">
<input type=button name="fa" onClick="this.value=((this.value=='Stop')?'Start':'Stop');auto();" value="Start" title="Autoplay" style="width:75px;">
</td></tr></table></form>

[jscheuer1]

<script type="text/javascript">

var x=0;

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

function auto() {
if(document.ff.fa.value == "Stop"){
rotate(++x);setTimeout("auto()", 2000);}}

var addEvent = (function(){return window.addEventListener? function(el, ev, f){
el.addEventListener(ev, f, false);
}:window.attachEvent? function(el, ev, f){
el.attachEvent('on' + ev, f);
}:function(){return;};
})();

addEvent(window, 'load', function(){setTimeout(auto, 2000);});
</script>

<form name="ff">
<table cellpadding="3" style="border:1px black solid;border-collapse:collapse;">
<tr><th align=center></th></tr>

<tr><td align=center>
<img src="http://cdn.ngin.com/attachments/photo/0500/8763/th_action_medium.jpg" name="show">
</td></tr>

<tr style="display: none;"><td align=center style="border:1px black solid;">
<select name="slide" onChange="rotate(this.selectedIndex);">
<option value="http://cdn.ngin.com/attachments/photo/0500/8763/th_action_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8768/th_goals_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8782/th_hits_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8788/th_saves_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8793/th_skill_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8798/th_speed_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8803/th_teamwork_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8813/th_thunder_medium.jpg"></option>
</select>
</td></tr>

<tr><td align=center style="border:1px black solid;">
<input type=button name="fa" onClick="this.value=((this.value=='Stop')?'Start':'Stop');auto();" value="Stop" title="Autoplay" style="width:75px;">
</td></tr></table></form>

[ltrue]

John,

Brilliant! Thanks so much. Is there a way to say center on page/frame and can I get rid of the stop/start button?

Lisa

[jscheuer1]

<script type="text/javascript">

var x=0;

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

function auto() {
if(document.ff.fa.value == "Stop"){
rotate(++x);setTimeout("auto()", 2000);}}

var addEvent = (function(){return window.addEventListener? function(el, ev, f){
el.addEventListener(ev, f, false);
}:window.attachEvent? function(el, ev, f){
el.attachEvent('on' + ev, f);
}:function(){return;};
})();

addEvent(window, 'load', function(){setTimeout(auto, 2000);});
</script>

<form name="ff">
<table align="center" cellpadding="3" style="border:1px black solid;border-collapse:collapse;">
<tr><th align=center></th></tr>

<tr><td align=center>
<img src="http://cdn.ngin.com/attachments/photo/0500/8763/th_action_medium.jpg" name="show">
</td></tr>

<tr style="display: none;"><td align=center style="border:1px black solid;">
<select name="slide" onChange="rotate(this.selectedIndex);">
<option value="http://cdn.ngin.com/attachments/photo/0500/8763/th_action_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8768/th_goals_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8782/th_hits_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8788/th_saves_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8793/th_skill_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8798/th_speed_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8803/th_teamwork_medium.jpg"></option>
<option value="http://cdn.ngin.com/attachments/photo/0500/8813/th_thunder_medium.jpg"></option>
</select>
</td></tr>

<tr style="display: none;"><td align=center style="border:1px black solid;">
<input type=button name="fa" onClick="this.value=((this.value=='Stop')?'Start':'Stop');auto();" value="Stop" title="Autoplay" style="width:75px;">
</td></tr></table></form>