$(document).ready(function(){
 	var a=document.getElementById("t1");
	var b=document.getElementById("t2");
	var c=document.getElementById("t3");
    var d=document.getElementById("t4");
    var e=document.getElementById("t5");
    var f=document.getElementById("t6");
    var g=document.getElementById("t7");
    var h=document.getElementById("t8");
    var i = document.getElementById("imgSearch");
	var d1=document.getElementById("div1");
	var d2=document.getElementById("div2");
	var d3=document.getElementById("div3");
	var d4=document.getElementById("div4");
	var d5=document.getElementById("div5");
	var d6=document.getElementById("div6");
	var d7=document.getElementById("div7");
	var d8=document.getElementById("div8");
	d1.onmouseover=a.onmouseover=function (){
	fx('div1','height',800);
	$("#t1").attr("src","images/brandBtn_on.jpg");
	};
	d1.onmouseout=a.onmouseout=function (){
	fx('div1','height',0);
	$("#t1").attr("src","images/brandBtn_off.jpg");
	};
	d2.onmouseover=b.onmouseover=function (){
	fx('div2','height',200);
	$("#t2").attr("src","images/typeBtn_on.jpg");
	};
	d2.onmouseout=b.onmouseout=function (){
	fx('div2','height',0);
	$("#t2").attr("src","images/typeBtn_off.jpg");
	};
	d3.onmouseover=c.onmouseover=function (){
	fx('div3','height',200);
	$("#t3").attr("src","images/priceBtn_on.jpg");
	};
	d3.onmouseout=c.onmouseout=function (){
	fx('div3','height',0);
	$("#t3").attr("src","images/priceBtn_off.jpg");
	};
    d4.onmouseover=d.onmouseover=function (){
    fx('div4','height',200);
    $("#t4").attr("src","images/yearBtn_on.jpg");
    };
	d4.onmouseout=d.onmouseout=function (){
	fx('div4','height',0);
	$("#t4").attr("src","images/yearBtn_off.jpg");
	};
d5.onmouseover=e.onmouseover=function (){fx('div5','height',800)};
d5.onmouseout=e.onmouseout=function (){fx('div5','height',0)};
d6.onmouseover=f.onmouseover=function (){fx('div6','height',800)};
d6.onmouseout=f.onmouseout=function (){fx('div6','height',0)};
d7.onmouseover=g.onmouseover=function (){fx('div7','height',800)};
d7.onmouseout=g.onmouseout=function (){fx('div7','height',0)};
d8.onmouseover=h.onmouseover=function (){fx('div8','height',800)};
d8.onmouseout=h.onmouseout=function (){fx('div8','height',0)};
i.onmouseover=function (){
    $("#imgSearch").attr("src", "images/searchBtn_on.jpg");
};
i.onmouseout=function (){
    $("#imgSearch").attr("src", "images/searchBtn.jpg");
};
	
if(document.body.clientWidth>963)
	{
		document.getElementById("div1").style.left = (document.body.clientWidth-963)/2+540+"px";
		document.getElementById("div2").style.left = (document.body.clientWidth-963)/2+580+"px";
		document.getElementById("div3").style.left = (document.body.clientWidth-963)/2+600+"px";
		document.getElementById("div4").style.left = (document.body.clientWidth-963)/2+680+"px";
		document.getElementById("div5").style.left = (document.body.clientWidth-963)/2+225+"px";
		document.getElementById("div6").style.left = (document.body.clientWidth-963)/2+310+"px";
		document.getElementById("div7").style.left = (document.body.clientWidth-963)/2+480+"px";
		document.getElementById("div8").style.left = (document.body.clientWidth-963)/2+560+"px";
	}
	else
	{
		document.getElementById("div1").style.left = "540px";
		document.getElementById("div2").style.left = "580px";
		document.getElementById("div3").style.left = "600px";
		document.getElementById("div4").style.left = "680px";
		document.getElementById("div5").style.left = "225px";
		document.getElementById("div6").style.left = "310px";
		document.getElementById("div7").style.left = "480px";
		document.getElementById("div8").style.left = "560px";
	}
	
});
window.attachEvent("onresize", sizeset);
function sizeset(){
	//alert(document.body.clientWidth);
	
	if(document.body.clientWidth>963)
	{
		document.getElementById("div1").style.left = (document.body.clientWidth-963)/2+540+"px";
		document.getElementById("div2").style.left = (document.body.clientWidth-963)/2+580+"px";
		document.getElementById("div3").style.left = (document.body.clientWidth-963)/2+600+"px";
		document.getElementById("div4").style.left = (document.body.clientWidth-963)/2+680+"px";
		document.getElementById("div5").style.left = (document.body.clientWidth-963)/2+225+"px";
		document.getElementById("div6").style.left = (document.body.clientWidth-963)/2+310+"px";
		document.getElementById("div7").style.left = (document.body.clientWidth-963)/2+480+"px";
		document.getElementById("div8").style.left = (document.body.clientWidth-963)/2+560+"px";
		document.getElementById("tips1").style.left = (document.body.clientWidth-963)/2+"px";
		document.getElementById("tips2").style.right = (document.body.clientWidth-963)/2+"px";
	}
	else
	{
		document.getElementById("div1").style.left = "540px";
		document.getElementById("div2").style.left = "580px";
		document.getElementById("div3").style.left = "600px";
		document.getElementById("div4").style.left = "680px";
		document.getElementById("div5").style.left = "225px";
		document.getElementById("div6").style.left = "310px";
		document.getElementById("div7").style.left = "480px";
		document.getElementById("div8").style.left = "560px";
		document.getElementById("tips1").style.left = "0px";
		document.getElementById("tips2").style.right = "0px";
	}
}
function fx(el,attr,to){
	el=typeof el=='string'?document.getElementById(el):el;
	if(to>0)el.style.display='block';
	var w=el['offset'+attr.replace(/^(.)/,new Function('return arguments[1].toUpperCase()'))];
	var Int=Math[to-w>0?'ceil':'floor'];
	clearInterval(el.timer);
	el.timer=setInterval(function(){
		w+=Int((to-w)*0.1);
		el.style[attr]=w+'px';
		if(w==to){	 
			if(to==0)el.style.display='none';
			clearInterval(el.timer);
		};	
	},10);
};