javascript - Slide multiple divs to side as one -

i trying make navigation bar displayed in line. sake of question have created this fiddle. hide red divs 1 div 1 side clicking on black div. put red divs 1 <div class="box"></div> , tried slide box div. messes up. instead of going side train expands multiple rows , hides. slide divs of class slide looks this. not want, because hides each 1 on own.

this might work you

fiddle

js:

state = true; $('.clickme').click(function () {     if (state) {         $("#inner").animate({             left: '-100px'         }, "slow");         state = false;     } else {         $("#inner").animate({             left: '0px'         }, "slow");         state = true;     }  }); 

html:

<div class="clickme"></div> <div id="outer">     <div id="inner">         <div class="slide"></div>         <div class="slide"></div>         <div class="slide"></div>     </div> </div>