如何实现jQuery幻灯片/反弹动画？

Question

基本上我想有一个DIV滑出，并做一个轻微的反弹，它通过它的最终大小，然后返回。不知道如何解释它，请参阅我在下面的图尝试：

---------------------> //Slides out 
       <---- //Then "bounces" back to it's final size 

我的第一部分向下使用切换动画：

$("#second").animate({ width: 'toggle' }, 85); 

我想我能得到通过的反弹效应做：

$("#second").animate({ width: 'toggle' }, 85).animate({ width: 'toggle' }, 75); 

但它消失。读过animate/toggle文档后，我想这是有道理的，但我仍然不确定如何获得所需的功能。有什么建议么？

奖励分数，如果您可以使滑动div的内容被切断而不是被推到下一行。

Answer 1

我能够实现这样说：

$("#second").animate({ width: 'toggle' }, 250).animate({ width: '-=10' },185); 

似乎是最直接的方式。

Answer 2

您需要添加一个complete处理程序。

Answer 3

我所知道的最简单的方法是使用jQuery Easinh Plugin（http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js）并使用“easeOutBack”方法。

$("#second").animate({ width: 'toggle' }, 85, "easeOutBack");