$(document).ready(
	function() {
		var currentPosition = 0;
		var slideWidth = 560;
		var slides = $('.slide');
		var numberOfSlides = slides.length;

		// Remove scrollbar in JS
		$('#slidesContainer').css('overflow', 'hidden');

		// Wrap all .slides with #slideInner div
		slides.wrapAll('<div id="slideInner"></div>')
		// Float left to display horizontally, readjust .slides
		// width
		.css({
			'float' : 'left',
			'width' : slideWidth
		});

		// Set #slideInner width equal to total width of all slides
		$('#slideInner').css('width', slideWidth * numberOfSlides);

		// Insert controls in the DOM
		$('#slideshow').prepend('<span class="control" id="leftControl">单击向左移动</span>').append('<span class="control" id="rightControl">单击向右移动</span>');

		// Hide left arrow control on first load
		manageControls(currentPosition);

		// Create event listeners for .controls clicks
		$('.control').bind(
			'click',
			function() {
				// Determine new position
				currentPosition = ($(this).attr('id') == 'rightControl') ? currentPosition + 1 : currentPosition - 1;

				// Hide / show controls
				manageControls(currentPosition);
				// Move slideInner using margin-left
				$('#slideInner').animate({'marginLeft' : slideWidth * (-currentPosition)});
			});

		// manageControls: Hides and Shows controls depending on
		// currentPosition
		function manageControls(position) {
			// Hide left arrow if position is first slide
			if (position == 0) {
				$('#leftControl').hide();
			} else {
				$('#leftControl').show();
			}
			// Hide right arrow if position is last slide
			if (position == numberOfSlides - 1) {
				$('#rightControl').hide();
			} else {
				$('#rightControl').show();
			}
		}
	});