$(document).ready(function() {
	//滚动函数------------------------------------------------------------------------------------------------------------begin
	leftID='.imgbottom'//定义左移动ID
	rightID='.imgtop'//定义右移动ID
	IDNum=$("#imgMouse").find('ul').find('li').length;//定义总数量的ID
	IDbox=$("#imgMouse").find('ul');//定义要移动区域
	speed=300;	//定义移动速度
	juli=87; //定义移动的距离
	yiye=3; //定于显示区域显示的个数
	gdNum=0;
	anjianTrue=false;
	leftNum=0;
	rightNum=0;
	rightNumMain=IDNum;
	$('.imgbottom').hide();
	if (IDNum==yiye || IDNum<yiye) {
		$(leftID).removeAttr('id');
		$(rightID).removeAttr('id');
		$('.imgtop').hide();
		$('.imgbottom').hide();
	} else {
		$(leftID).attr('id','shuBiaomove');
		$(rightID).attr('id','shuBiaomove');
	}	
	$(leftID).click(function leftMain() {
		$(rightID).show();
		var liNum=IDNum;
		//停止向上滚动的条件
		if (liNum==yiye && liNum<yiye) { return false;}//如果总数量 小于或等于 当前显示数量，那么停止向上滚动
		if (anjianTrue && leftNum==0) { return false;}//如果滚动触发，已移动到最左部，那么停止滚动
		//开始向上滚动的条件
		if (liNum>yiye && leftNum!=0) {//如果总数量大大于当前显示数量，且左移动数不等于0
		
			roll(-1);
			leftNum--;
			rightNum--;
		};
		if (anjianTrue && leftNum==0) {$(leftID).hide();return false;}
	});
	$(rightID).click(function rightMain() {
		$('.imgbottom').show();
		var liNum=IDNum;
		var chashu=rightNumMain-yiye;
		//停止向右滚动的条件
		if (liNum==yiye && liNum<yiye) { return false; }//如果总数量 小于或等于 当前显示数量，那么停止向左滚动
		if (rightNum==chashu) {$(rightID).hide(); return false;}//如果滚动触发，已移动数等于到最右部的数，那么停止滚动
		anjianTrue=true;
		//开始向右滚动的条件
		if (liNum>yiye) {//如果总数量大大于当前显示数量
			roll(1);
			rightNum++;//右移动数触发自加
			leftNum++;//左边的滚动数开始上加
		}
		if (rightNum==chashu) {$(rightID).hide(); return false;}
	});
	function roll(j) {
			gdNum+=j;
			if(j == -1) {
			
				IDbox.animate({"left" : -(juli*gdNum)+"px"},speed);
			} else {
	
				IDbox.animate({"left" : -(juli*gdNum)+"px"},speed);
			}	
	};
	//滚动函数------------------------------------------------------------------------------------------------------------end		
	var imgsrc=$('#imgMouse').find('img').eq(0).attr('src');
	$('#imgMouse').find('img').eq(0).animate({opacity:1}, 200);
	$('#imgBox').attr('src',imgsrc);
	$('#imgMouse').find('img').css({opacity: 0.4});
	$('#imgMouse').find('img').click(function() {
		var imgsrc2=$(this).attr('src');	
		$('#imgBox').attr('src',imgsrc2);
		$('#imgMouse').find('img').css({opacity: 0.4});
		$(this).animate({opacity:1}, 200);
		return false;
	});
})