$(document).ready(function(){
						   
var t=false; //定時器ん
var time=4000; //切換間隔
var speed=500; //滾動時間
var fot=300; //fadeout時間
var fin=300; //fadein時間
var i=0; //開始數						   
var len=$("#list li").length; //滾動數量
var wh=330; //滾動寬度

$("#info").css({"width": wh*len + "px"});

function cur(ele,currentClass){
	ele= $(ele)? $(ele):ele;
	ele.addClass(currentClass).siblings().removeClass(currentClass);
}


$("#prev").click(function(){			
		roll(-1);		
})
    
$("#next").click(function(){			
		roll(1);		
})	


$("#list li").mouseover(function(){
		checkfade();
		i=$("#list li").index($(this)[0]);	
		if(!$(this).hasClass("cur")){
			fade(i);
		}		
		cur(this,"cur");		
})


function roll(j){
		checkroll();
		if(!$("#info").is(":animated")){
			i+=j;					
			if(i!=-1 && i!=len){						
				$("#info").animate({"left" : -(wh*i)+"px"},speed);
				//cur($("#list li").eq(i) , "cur");						
			}else if(i==-1){
				i=len-1;
				$("#info").css({"left" : -(wh*(i-1))+"px"});
				$("#info").animate({"left" : -(wh*i)+"px"},speed);
				//cur($("#list li").eq(i) , "cur");
			}else if(i==len){								
				i=0;
				$("#info").css({"left" : -wh+"px"});
				$("#info").animate({"left" : 0+"px"},speed);						
			}	
			cur($("#list li").eq(i) , "cur");			
		}			
}
		

function fade(k){
	checkfade();
	$("#info").find("div:visible").fadeOut(fot,function(){
		$("#info").find("div").eq(k).fadeIn(fin)
	})
}
		

function checkroll(){		
	if($("#info").find(".hide").html()){
		//alert("checkroll"+index);
		$("#info").find("div").removeClass("hide").show();
		$("#info").css({"left" : -(wh*i)+"px"});
	}
}

	
function checkfade(){
	if(!$("#info").find(".hide").html()){
		$("#info").find("div").not($("#info").find("div").eq(i)).addClass("hide");
		$("#info").css({"left" : 0+"px"});
	}
}
	

function setInt(){
	t=setInterval(function(){roll(1)},time);
}
function clearInt(){
	if(t) clearInterval(t);
}
		
$("#area").hover(
	function(){ clearInt() },
	function(){ setInt() }
)	
	

$(document).keydown(function(event){ 
	event = event || window.event;
	if(event.keyCode==38 || event.keyCode==37){	
		clearInt();
		roll(-1);
		setInt();
	};
	if(event.keyCode==40 || event.keyCode==39){			
		clearInt();
		roll(1);
		setInt();
	};	
})
	
setInt();	

})