 <!--  initialize the slideshow when the DOM is ready -->
$(document).ready(function() {
    $('.slideshow').cycle({
		fx:     'scrollHorz',  
		delay:  1000, 
    	speed:  500
	});
	
	//Handle pausing and playing
	$('#pausePlayButton').click(function() {
 
	  //Check to see if the slideshow is currently paused.
	  if ($(this).hasClass('playState')) { 
		//Resume the slideshow, remove the class from the #play-pause button and change the text to Pause
		$('.slideshow').cycle('resume');
		$(this).removeClass('playState'); 
	  } //if
	  else { 
		//Pause the slideshow, add the paused class to the #play-pause button and change the text to Play
		$('.slideshow').cycle('pause');
		$(this).addClass('playState'); 
	  } //else
	 
	  //Make sure nothing else happens when you click the #play-pause button
	  return false;
	});
	
	//prev button
	$('#prevButton').click(function() { 
        $('.slideshow').cycle('prev');  
		
		  //Check to see if the slideshow is currently paused.
		  if ($('#pausePlayButton').hasClass('playState')) { 
			//Resume the slideshow, remove the class from the #play-pause button and change the text to Pause 
			$('#pausePlayButton').removeClass('playState'); 
			$('.slideshow').cycle('resume');
		  }  
		 return false;
    }); 
     
	//prev button
    $('#nextButton').click(function() {  
        $('.slideshow').cycle('next');  
		 
		//Check to see if the slideshow is currently paused.
		  if ($('#pausePlayButton').hasClass('playState')) { 
			//Resume the slideshow, remove the class from the #play-pause button and change the text to Pause 
			$('#pausePlayButton').removeClass('playState'); 
			$('.slideshow').cycle('resume');
		  } 
		return false;
    }); 
	
});