求个合理解释
<html><head>
<title> A Timed Slide show</title>
<script type="text/javascript">
<!--hide me from older browsers
var the_images=new Array();
the_images[0]=new Image();
the_images[0].src="one.jpg";
the_images[1]=new Image();
the_images[1].src="two.jpg";
the_images[2]=new Image();
the_images[2].src="three.jpg";
var the_timeout;
//var index=0;
function rotateImage(index)
{
window.document.my_image.src=the_images[index].src;
index++;
if(index>=the_images.length)
{
index=0;
}
the_timeout=setTimeout("rotateImage(index);",1000);
}
//show me-->
</script>
</head>
<body>
<img name="my_image" src="one.jpg">
<from>
<input type="button" value="Start the Show"
onClick ="clearTimeout(the_timeout);rotateImage(0);">
<input type="button" value="Stop the Show"
onClick="clearTimeout(the_timeout);">
</form>
</body>
</html>