var current = 0;

jQuery(document).ready(function() {

	jQuery("#slider1").click(function(){
		if (current != 1) {
			jQuery("#slider1").animate( {"width": "575px"}, "slow");
			jQuery("#slider2").animate( {"width": "115px", "left": "575px"}, "slow");
			jQuery("#slider3").animate( {"width": "115px", "left": "690px"}, "slow");
			jQuery("#slider4").animate( {"width": "115px", "left": "805px"}, "slow");

			jQuery("#image1").animate( {"width": "230px"}, "slow");
			jQuery("#image2").animate( {"width": "115px"}, "slow");
			jQuery("#image3").animate( {"width": "115px"}, "slow");
			jQuery("#image4").animate( {"width": "115px"}, "slow");

			current = 1;
		}
	});

 		jQuery("#slider2").click(function(){
		if (current != 2) {
			jQuery("#slider1").animate( {"width": "115px"}, "slow");
			jQuery("#slider2").animate( {"width": "575px", "left": "115px"}, "slow");
			jQuery("#slider3").animate( {"width": "115px", "left": "690px"}, "slow");
			jQuery("#slider4").animate( {"width": "115px", "left": "805px"}, "slow");

			jQuery("#image1").animate( {"width": "115px"}, "slow");
			jQuery("#image2").animate( {"width": "228px"}, "slow");
			jQuery("#image3").animate( {"width": "115px"}, "slow");
			jQuery("#image4").animate( {"width": "115px"}, "slow");

			current = 2;
		}
	});

 		jQuery("#slider3").click(function(){
		if (current != 3) {
			jQuery("#slider1").animate( {"width": "115px"}, "slow");
			jQuery("#slider2").animate( {"width": "115px", "left": "115px"}, "slow");
			jQuery("#slider3").animate( {"width": "575px", "left": "230px"}, "slow");
			jQuery("#slider4").animate( {"width": "115px", "left": "805px"}, "slow");

			jQuery("#image1").animate( {"width": "115px"}, "slow");
			jQuery("#image2").animate( {"width": "115px"}, "slow");
			jQuery("#image3").animate( {"width": "228px"}, "slow");
			jQuery("#image4").animate( {"width": "115px"}, "slow");

			current = 3;
		}
	});

 		jQuery("#slider4").click(function(){
		if (current != 4) {
			jQuery("#slider1").animate( {"width": "115px"}, "slow");
			jQuery("#slider2").animate( {"width": "115px", "left": "115px"}, "slow");
			jQuery("#slider3").animate( {"width": "115px", "left": "230px"}, "slow");
			jQuery("#slider4").animate( {"width": "575px", "left": "345px"}, "slow");

			jQuery("#image1").animate( {"width": "115px"}, "slow");
			jQuery("#image2").animate( {"width": "115px"}, "slow");
			jQuery("#image3").animate( {"width": "115px"}, "slow");
			jQuery("#image4").animate( {"width": "228px"}, "slow");

			current = 4;
		}
	});

});