function hidLeftMenuli(idname)
{
$("#"+ idname+" > li").each(function(){ 	
if($(this).attr("class")=="hidd"){
$(this).removeClass("hidd"); 
$(this).addClass("show"); 
}
else
{
$(this).removeClass("show"); 
$(this).addClass("hidd"); 
}
});
}

function HideleftMenu()
{
$('#leftMenu > ul').each(function(){ 
var idname = $(this).attr('id'); 
$("#"+ idname+" > li").each(function(){ 	
$(this).removeClass("show"); 
$(this).addClass("hidd"); 
});
});
}


function ShowLeftMenu(idname)
{
$("#"+ idname+" > li").each(function(){ 	

$(this).removeClass("hidd"); 
$(this).addClass("show"); 
});
}



$(document).ready(function() 
{ 
  $('#leftMenu > ul').each(function(){ 
                $(this).click( 
                    function(){
						HideleftMenu();
					var idname = $(this).attr('id'); 
					ShowLeftMenu(idname);
                        }); 
         }); 
          



});


var flag_KeyHold=false;//判断是否鼠标被按住
var product_count=1;//多少个产品
var scroll_length=208;//每组产品的宽度
var bar_scroll_length=0;//bar每次需要滚动多少
var flag_in_bar=0;//鼠标是否在滚动条里
var scrollbar_length= 0;//滚动条的长度
var scrollbarcontainer_length=0;//滚动条容器的长度
var scrollbarcontainerArrowleft_length=20;//容器的左箭头宽度
var scrollbarcontainerArrowRight_length=20;//容器右箭头宽度
var ScrollBar_Left=0;//滚动条左边的位置
var ScrollBar_mouse_Click_pos=0;//当鼠标点击滚动条时鼠标的初始位置
var ScrollBar_mouse_move=0;//拖动滚动条时鼠标移动了多少距离



//容器上的滚动条滑动事件
function ProductBrowerBarMove(e)
{
var width = parseInt(scrollbarcontainer_length) -parseInt(scrollbar_length);
var move=ScrollBar_mouse_move;
ScrollBar_mouse_move= ScrollBar_mouse_move- ScrollBar_mouse_Click_pos; 
if(parseInt(ScrollBar_mouse_move) <= parseInt(scrollbarcontainerArrowleft_length)){ScrollBar_mouse_move=parseInt(scrollbarcontainerArrowleft_length);}
if(parseInt(ScrollBar_mouse_move) >= width-parseInt(scrollbarcontainerArrowRight_length)){ScrollBar_mouse_move= width-parseInt(scrollbarcontainerArrowRight_length);}	

if(flag_KeyHold==true)
{
$('#productcontainer_bar').css("left", (ScrollBar_mouse_move)+"px");
$('#productcontainer_ul').css("left",-(ProductScroll_left(ScrollBar_mouse_move-scrollbarcontainerArrowleft_length))+'px');

}

}



//滚动条移动多少，返回产品图片就移动多少
function ProductScroll_left(ScrollBar_move)
{
//由于保持始终有3张显示，就要减去那3张的宽度
//产品的总长度*单个产品的宽度*（滚动条所在的位置）/(滚动条容器的长度-滚动条长度-左箭头长度-右箭头长度)
return (parseInt(product_count)-3)*scroll_length*parseInt(ScrollBar_move)/(parseInt(scrollbarcontainer_length)-parseInt(scrollbar_length)-scrollbarcontainerArrowleft_length-scrollbarcontainerArrowRight_length);


}

//产品图片滚动多少，就返回滚动条滚动多少
function ScrollBar_MoveLength(product_move)
{
//由于保持始终有3张显示，总长度就要减去那3张的宽度
//(滚动条容器的长度-滚动条长度-左箭头长度-右箭头长度)*产品滚动的长度/(产品的总长度*单个产品的宽度)
return (parseInt(scrollbarcontainer_length)-parseInt(scrollbar_length)-scrollbarcontainerArrowleft_length-scrollbarcontainerArrowRight_length)*product_move/(parseInt(product_count-3)*scroll_length);


}



function ProductBrowerArrow_right_Click()
{
 var bar_po= $('#productcontainer_bar').css("left");  
var bar_ul_po= $('#productcontainer_ul').css("left"); 

if(parseInt(bar_po)+bar_scroll_length< parseInt(scrollbarcontainer_length) -parseInt(scrollbar_length)){
  
   $('#productcontainer_bar').animate({left:(parseInt(bar_po)+bar_scroll_length)+ 'px'}, 300);
 $('#productcontainer_ul').animate({left:(-scroll_length+parseInt( bar_ul_po))+ 'px'}, 300);
 }
 else
 {
  $('#productcontainer_bar').animate({left:'585px'}, 300);
 $('#productcontainer_ul').animate({left:-((product_count-3)*scroll_length)+'px'}, 300);
 }

 
}


function ProductBrowerArrow_left_Click()
{
 var bar_po= $('#productcontainer_bar').css("left");  
   var bar_ul_po= $('#productcontainer_ul').css("left");
 
if(parseInt(bar_po)-bar_scroll_length>=scrollbarcontainerArrowleft_length){

 $('#productcontainer_bar').animate({left:(parseInt(bar_po)-bar_scroll_length)+ 'px'}, 300);
 $('#productcontainer_ul').animate({left:(scroll_length+parseInt(bar_ul_po))+ 'px'}, 300);
 }
 else
 {
  $('#productcontainer_bar').animate({left: '20px'}, 300);
 $('#productcontainer_ul').animate({left: '0px'}, 300); 
 
 }
 
 
 
}



function ProductBrowerBar_Click(e)
{

if(flag_in_bar==0){

var MouseClick_posX=parseInt(e.clientX-parseInt(ScrollBar_Left));


if(parseInt(MouseClick_posX)<=parseInt(scrollbarcontainerArrowleft_length))
{MouseClick_posX=scrollbarcontainerArrowleft_length;}

if(parseInt(MouseClick_posX) >= parseInt(scrollbarcontainer_length) -parseInt(scrollbar_length)-parseInt(scrollbarcontainerArrowRight_length))
{MouseClick_posX=parseInt(scrollbarcontainer_length) -parseInt(scrollbar_length)-parseInt(scrollbarcontainerArrowRight_length);}

$('#productcontainer_bar').animate({left:MouseClick_posX+ 'px'}, 300);
$('#productcontainer_ul').animate({left:(-ProductScroll_left(MouseClick_posX-scrollbarcontainerArrowleft_length))+ 'px'}, 300);

}

}







$(document).ready(function() 
{ 

scrollbar_length= $('#productcontainer_bar').css("width");//滚动条的长度
scrollbarcontainer_length= $('#barcontainer').css("width");//滚动条容器的长度


product_count= $('#productcontainer_ul > li').size();
bar_scroll_length=ScrollBar_MoveLength(scroll_length);



//得到滚动条左边的距离
var myoffset = $('#productcontainer_bar').offset();
ScrollBar_Left= parseInt(myoffset.left); 


  $('body').mousemove(function(e){   
  ScrollBar_mouse_move= parseInt(e.clientX-ScrollBar_Left);
  //在bar上把鼠标按下
  $('#productcontainer_bar').mousedown(function(e){    
 flag_KeyHold=true;
 ScrollBar_mouse_Click_pos= ScrollBar_mouse_move- (parseInt($('#productcontainer_bar').offset().left)- ScrollBar_Left); ;     					
		  }); 
		  
		 $('#test').html(e.clientX+","+ScrollBar_Left); 
//鼠标拖拽滚动条事件
ProductBrowerBarMove(e);
 });

 //释放鼠标	  
$('*').mouseup(function(){
flag_KeyHold=false;
}); 

		


$('#ProductArrow_Back').mouseout(function(e){     
flag_in_bar=0;        					
		  }); 

 $('#ProductArrow_Back').mouseover(function(e){     
flag_in_bar=1;      					
		  }); 

$('#ProductArrow_Preview').mouseout(function(e){     
flag_in_bar=0;        					
		  }); 

 $('#ProductArrow_Preview').mouseover(function(e){     
flag_in_bar=1;      					
		  }); 
	  

$('#productcontainer_bar').mouseout(function(e){     
flag_in_bar=0;        					
		  }); 

 $('#productcontainer_bar').mouseover(function(e){     
flag_in_bar=1;      					
		  }); 

   
       $('#ProductArrow_Preview').click(function(e){     
ProductBrowerArrow_left_Click();        					
		  }); 
      
       $('#ProductArrow_Back').click(function(e){     
ProductBrowerArrow_right_Click();        					
		  }); 

       $('#barcontainer').mouseup(function(e){     
ProductBrowerBar_Click(e);        					
		  }); 
         
  
            });