JQuery切換註冊多個div

Question

我有以下問題。

我有一個在頁面右側的註冊表。它最後有一個按鈕，如果你點擊按鈕，註冊表應該滾動到屏幕上，如果再次點擊，應該再次隱藏。

這是我目前的解決方案：

jsfiddle.net/6JLr9/

（按鈕：綠色，內容：紅色

這裏我的問題是：在隱藏和顯示動畫，按鈕當動畫結束時，按鈕直接移動到新的（正確的）位置，我怎樣才能使按鈕同時移動？

先謝謝你

Answer 1

我已更新您的jsfiddle。 在js和css中改變了一些東西。

JS：

$(document).ready(
function(){ 
    $('.registers').click(
     function(){ 
      if($(this).hasClass('open')){ 
       $('.registers-wrapper').animate({'margin-left':'-33px'},1000); 
       $(this).removeClass('open'); 
      }else{ 
       $('.registers-wrapper').animate({'margin-left':'-233px'},1000); 
       $(this).addClass('open'); 
      }   
     }) 
} 
); 

CSS：

.registers { 
width:33px; 
height:136px; 
background-repeat:no-repeat; 
float:left; 
z-index:50; 
} 

.registers-content { 
height:136px; 
width:200px; 
background-repeat:repeat-x; 
background-color:red; 
float:left; 
z-index:50; 
} 

.registers-wrapper { 
    position:fixed; 
    left:100%; 
    z-index:50; 
    margin-left:-33px; 
    width:233px; 
} 



.videohilfe-wrapper { 
top:160px; 
} 
.videohilfe { 
background-color:green; 
} 
.videohilfe-content { 
} 

現在按預期工作。

Answer 2

我對Javascript和CSS做了一些改動。下面是變化

的Javascript：

$(document).ready(
    function(){ 
     $('.videohilfe').click(function(){ 
       if($('.videohilfe-wrapper').css('right') == '-200px') 
        $('.videohilfe-wrapper').animate({right:'0px'}); 
       else 
        $('.videohilfe-wrapper').animate({right:'-200px'}); 
      }); 
     } 
    ); 

CSS：

.registers-wrapper { 
    position:fixed; 
    right:-200px; /* changed */ 
    z-index:50; 
}