var slideTimer = 0; //Define the timer
	var slideDisplay = 4000; //Set time each slide will display for
	var slideWidth = 580; //Set width of the slides
	var noOfSlides = 3; //Total no. of slides
	var currentSlide = 1; //Set as default to start on frame 1
	var nextSlide = 2; //This is the default 'next' frame

	function getShowreel() {
		var showreel = document.getElementById('showreel'); //Get the div that holds the images in a line
		return showreel;
	}

	function startRolling() {
		//If you want to stop this from occurring if coming from a click event etc, add an argument to the click saying 'stop', then check for it here
		//If you do stop it, set the stop statement to clearTimeout(slideTimer)
		if (parseInt(currentSlide) == parseInt(noOfSlides)) {
			currentSlide = 0;
		}
		nextSlide = parseInt(currentSlide) + 1;
		slideTimer = setTimeout("preSlide(nextSlide,'start')", slideDisplay);
		currentSlide = currentSlide + 1;
	}

	function moveSlide(endposa) {
		var showreel = getShowreel(); //Get the div that holds the images in a line
		showreel.style.left = endposa + "px";
	}

	function preSlide(number) {
		if (number == 1) {
			var endpos = 0; //If frame 1, then set the end value of the 'left' style as default
		} else if (number == 2) {
			var endpos = -slideWidth; //If frame 2, then set the end value of the 'left' style as default minus width of frame 1
		} else if (number == 3) {
			var endpos = (2 * -slideWidth); //If frame 3, then set the end value of the 'left' style as default minus width of frame 1 and 2
		} else {
			var endpos = 0;
		}
		changeBtn(number)
		moveSlide(endpos);
		currentSlide = number;
		clearTimeout(slideTimer); //Clear the timer incase this function is called from a button Click - which may already be half way through the timeout
		startRolling(); //Set up the next scroll which will re-call this function after a set time
	}

	function changeBtn(selectedBtn) {
		for (i=1;i<=noOfSlides;i++) {
			if (i == selectedBtn) {
				document.getElementById('slideBtn'+i).src = "images/hp_control_"+i+"b.gif";
			} else {
				document.getElementById('slideBtn'+i).src = "images/hp_control_"+i+"a.gif";
			}
		}
	}