<h1> Slideshow </h1>
<a href="javascript:sideit()"><img src="p1.jpg" id="slide" width=500 height=500 /> </a>
<br></br>
<input id = "play" type="button" value="play" onclick="javascript:play()">
<input id= "stop" type="button" value="stop" onclick="javascript:stop()">
<input id = "weiter" type="button" value=">>" onclick="javascript:slideit()">
<input id = "zurück" type="button" value="<<" onclick="javascript:slideback()">

<script type ="text/javascript">

var step = 0;
var whichimage = 0;
var play = 0;

function stop(){
    play = 0;
}

function start() {
    play = 1;
    setTimeout("slideit()",1000);
}

function slideit(){
	if(!document.images)
	return
	document.getElementById('slide').src = slideimage[step].src
	whichimage = step
	if(step<5) {
		step++;
	} else {
		step=0;
	}

	if (play == 1) {
		setTimeout("slideit()",1000);
	}
}

function slideback(){
	if(!document.images)
	return
        step = step -2;
        if (step < 0) {
		step = step + 5;
        }

	document.getElementById('slide').src = slideimage[step].src
	whichimage = step
	if(step<5) {
		step++;
	} else {
		step=0;
	}

	if (play == 1) {
		setTimeout("slideit()",1000);
	}
}
slideit()
</script>
</body>
</html>