切換動畫？

Question

我有這樣的代碼：

$('.couch-hide').click(function() { 
    $(this).animate({right:0},1000, 'easeOutBounce');   
}); 

我試圖得到它的切換，所以在第一次點擊，彈出出來，然後再次單擊，然後將其收回裏面。我需要將變量設置爲跟蹤器嗎？要說明它處於什麼階段？

Answer 1

只需將原始值保存在某處，並記住在開始新動畫前停止任何正在進行的動畫。動畫程序將負責其餘的：

var panel = $('.couch-hide'); 
var originalPos = panel.css("right"); 
panel.toggle(function() { 
    $(this).stop().animate({right:0},1000, 'easeOutBounce'); 
    }, 
    function() { 
    $(this).stop().animate({right:originalPos},1000, 'easeOutBounce'); 
    }); 

Answer 2

一般jQuery的切換工作幾乎在一個標準的方式如下，但是我還沒有真正嘗試過用動畫的東西，但這個可能工作。

$('.couch-hide').click(function() { 
    $(this).animate({right:0},1000, 'easeOutBounce').toggle();      
});