$(document).ready(function(){

	$("#colorChange01 li").hover(function(){
		var styleIMG = $("img[name='style']")[0].src;
		var styleIMGNum = styleIMG.slice(-6,-4);

		var colorSrc = $(this.firstChild)[0].src;
		var colorSrc = colorSrc.replace("_ovr","");
		var colorSrcNum = colorSrc.slice(-6,-4);

		if(styleIMGNum == colorSrcNum){
		}else{
			var xx = colorSrc.indexOf("_ovr");
			if(xx !== -1){
			}else{
				var colorNum = colorSrc.replace(".png","_ovr.png");
				$(this.firstChild)[0].src = colorNum;
			}
		}
	},

	function(){
		var styleIMG = $("img[name='style']")[0].src;
		var styleIMGNum = styleIMG.slice(-6,-4);

		var colorSrc = $(this.firstChild)[0].src;
		var colorSrc = colorSrc.replace("_ovr","");
		var colorSrcNum = colorSrc.slice(-6,-4);

		if(styleIMGNum == colorSrcNum){
		}else{
			var colorSrc = $(this.firstChild)[0].src;
			var xx = colorSrc.indexOf("_ovr");
			if(xx !== -1){
				var colorNum = colorSrc.replace("_ovr.png",".png");
				$(this.firstChild)[0].src = colorNum;
			}else{
			}
		}
	});

	$("#colorChange01 li").click(function(){

		var colorSrc = $(this.firstChild)[0].src;
		var number = colorSrc.slice(-10,-8);
		var number = number+".";

		var IMG = $("img[name='style']")[0].src;
		var IMGNum = IMG.slice(-6,-3);
		var IMG = IMG.replace(IMGNum,number);
		$("img[name='style']")[0].src = IMG;

		var Color = $("#colorChange01 img")[0].src;

		var currentIMG = IMG.slice(-5,-4);

		var IMGlen = $("#colorChange01 img").length;
		for(i=0;i<IMGlen;i++){
			var styleIMG = $("#colorChange01 img")[i].src;
			var styleIMGNum = styleIMG.replace("_ovr","");

			if(currentIMG == i+1){
			}else{
				$("#colorChange01 img")[i].src = styleIMGNum;
			}
		}
	});

});