var hCurr=0;
var hCount;
var timeOut=3500;
var timeInterval;
$(function(){		
		  $(".miniImg").hide();
		  $("#banner_index").hover(function(){
				$(".miniImg").stop(true,true).fadeIn(500);		
			},function(){
				$(".miniImg").stop(true,true).fadeOut(500);	
			});
		  
		  $(".bigImg > li:eq(0)").clone().appendTo(".bigImg");
		  hCount=$(".bigImg > li").length;
		  $(".bigImg").css("top",-(hCount-1)*300+"px");
		  slideBanner(hCount-1);
		 
		 //miniImg Position
		  pageWidth=$(document).width();
		  miniNum=$(".miniImg > li").length;
		  miniWidth=miniNum*($(".miniImg > li:eq(0)").width()+8);
		  //$(".miniImg").css("width",miniWidth+50+"px");
		  miniPos=(pageWidth-960)/2+"px";
		  $(".miniImg").css("right",miniPos);
		  
		/* for(var i=0;i<miniNum;i++){
			$(".miniImg > li").eq(i).attr("num",i); 
		 }*/
		 $(".miniImg > li").click(function(){
			$(this).addClass("sel").siblings().removeClass("sel");
			currNum=parseInt($(this).attr("num"));
			clearTimeout(timeInterval);
			slideBanner(currNum);
		});
});

function slideBanner(id){			 
			  	hCurr=(id>=0)?id:(hCount-1);
				hPos= -hCurr*300+"px";		
				$(".miniImg > li[num='"+hCurr+"']").addClass("sel").siblings().removeClass("sel");
				$(".bigImg").stop().animate({top:hPos},700);	
				if(hCurr==0){
					//$("#banner > ul").css("top","0px");
					$(".miniImg > li").eq(0).addClass("sel").siblings().removeClass("sel");
					$(".bigImg").animate({top:(1-hCount)*300+"px"},1);					
					hCurr=hCount-1;					
				}				
				hCurr--;			
				timeInterval=setTimeout("slideBanner(hCurr)",timeOut);
 }
 
 function tag(n){
	for(i=1;i<8;i++){
		if(n == i){
			document.getElementById('page'+i).className = 'page_on';
		}else{
			document.getElementById('page'+i).className = 'page_no';
		}
	}
}
 
function tag1(n){
	for(i=1;i<2;i++){
		if(n == i){
			document.getElementById('page'+i).className = 'page_on';
		}else{
			document.getElementById('page'+i).className = 'page_no';
		}
	}
}

function tag2(n){
	for(i=1;i<=2;i++){
		if(n == i){
			document.getElementById('page'+i).className = 'i_4n';
		document.getElementById('tit'+i).className = 'tit_img';
		}else{
			document.getElementById('page'+i).className = 'i_4n2';
			document.getElementById('tit'+i).className = '';
		}
	}
}

function tag22(n){
	for(i=1;i<=2;i++){
		if(n == i){
			document.getElementById('page2'+i).className = 'i_4n';
			document.getElementById('tit2'+i).className = 'tit_img';
		}else{
			document.getElementById('page2'+i).className = 'i_4n2';
			document.getElementById('tit2'+i).className = '';
		}
	}
}