Анимация div в другом div

Question

У меня есть следующее. Это будет анимировать div onClick. Я хочу, чтобы div с списком меню и изображением перешел в желтый div вместо того, чтобы идти в пустое пространство. Надеюсь, ты понял. Есть ли способы достичь этого? This is what I have

 <div id="content"> 
      <div id="pageNav" style="z-index:9999; position:relative;height:180px;"> 
      <button id="showmenu" type="button">Hide menu</button> 
      <div class="sidebarmenu" style="position: absolute;"> 
       Menu List 
       <img class="image" src="http://www.glamquotes.com/wp-content/uploads/2011/11/smile.jpg"> 
      </div> 
     </div> 
     </div> 

CSS:

#showmenu { 
background: #d2d2d2; 
border-radius: 35px; 
border: none; 
height:30px; 
width:140px; 
font-weight:bold; 
position:relative; 
left:10px; 
top:10px; 
margin-bottom:15px; 
} 
#content{ 
background:yellow; 
height:300px; 
width:300px; 
margin-left:30px; 
} 
.image{ 
height:90px; 
width:90px; 
} 
.sidebarmenu{ 
background:pink; 
height:150px; 
width:150px; 
text-color:white; 
} 

JQuery

  $(document).ready(function() { 
       $('#showmenu').click(function() { 
       var hidden = $('.sidebarmenu').data('hidden'); 
       $('#showmenu').text(hidden ? 'Hide Menu' : 'Show Menu'); 
       if(hidden){ 
        $('.sidebarmenu,.image').animate({ 
        left: '0px' 
       },500) 
       } else { 
        $('.sidebarmenu,.image').animate({ 
        left: '-210px' 
       },500) 
       } 
       $('.sidebarmenu,.image').data("hidden", !hidden); 

       }); 
      }); 

Answer 1

Добавить переполнение скрытый в вашем #content:

#content { 
    background: yellow; 
    height: 300px; 
    width: 300px; 
    margin-left: 30px; 
    overflow: hidden; 
} 

Обновлено Fiddle

Причина, по которой мы добавляем переполнение, заключается в том, что в нашей текущей анимации мы перемещаем ее влево, заставляя ее выйти за пределы периметра содержащего элемента (здесь #content), когда переполнение не установлено для скрытого значения по умолчанию: visible.

Я рекомендую прочитать это article, чтобы лучше понять абсолютное позиционирование.