kev999

<script type="text/javascript">
$(document).ready(function(e) {
	/*
		DIMENSIONS
	*/
	gp_width = 0;
	$('#gallery .panel').each(function(index, element) {
		gp_width = gp_width+$(this).width();
	});
	p_width = $('#gallery .panel').width();
	/*
		WRAP PANELS
	*/
    $('#gallery .panel').wrapAll('<div class="gallery-container"></div>');
	$('.gallery-container').width(gp_width)
	.css({
		'position':'absolute',
		'left':'0px',
		'top':'0px'
	});
	/*
		FLOAT PANELS
	*/
	$('#gallery .panel').css({
		'float':'left',
		'width':'720px'
		});
	/*
		CLONE CONTAINER
	*/
	$('.gallery-container')
		.clone()
		.prependTo('#gallery')
		.css({
			'left': gp_width*-1
		});
	/*
		FUNCTIONS
	*/
	function galleryLeft() {

		$('.gallery-container').each(function() {
			$(this).animate({
				'left': $(this)[0].offsetLeft-p_width
			},1200,'swing',function() {
				if ($(this)[0].offsetLeft < ($(this).width())*-1) {
					$(this).css('left',$(this)[0].offsetLeft+($(this).width())*2);
					return;
				}
			})
		});

	}
	function galleryRight() {
		$('.gallery-container').each(function() {
			$(this).animate({
				'left': $(this)[0].offsetLeft+p_width
			},1200,'swing',function() {
				if ($(this)[0].offsetLeft >= ($(this).width())) {
					$(this).css('left',$(this).width()*-1);
					return;
				}
			})
		});
	}
	/*
		EVENTS
	*/
	$('#gallery .nav .left').click(function(e) {
		stopAutoGallery();
		galleryLeft();
		startAutoGallery();
    });
	$('#gallery .nav .right').click(function(e) {
		stopAutoGallery();
		galleryRight();
		startAutoGallery()	;
    });
	/*
		AUTOSTART
	*/
	var autoGallery;
	startAutoGallery();

	function startAutoGallery() {
		autoGallery = setInterval(function(){galleryLeft()}, 4000);
	}
	function stopAutoGallery() {
		$('.gallery-container').promise().done(function() {
			clearInterval(autoGallery);
		});
	}


});
</script>