jquery - 切换动画？

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();                       
});