jQuery悬停动画队列

Question

在完全理解jQuery中的动画是如何排队和初始化的过程中遇到了一些麻烦。通过编写一些按钮效果，试图让这个概念更加舒适。

我想将下面的笔的代码变成一个平滑的动画（如你可以看到，如果你多次悬停在按钮上遇到一些问题），执行每个动画悬停在只有当没有另一个动画将在上执行，然后只在动画中的悬停结束时执行悬停动画。

这里是我的代码：http://jsbin.com/larukayi/1/edit

在此先感谢您的帮助！

Answer 1

我觉得下面的变化得到预期的结果：

button1.css("cursor", "pointer").hover(
     function(){ 
     slideup.stop(true).animate({ 
      "bottom":"0px" 
     }, 150, 'linear'); 
     slideup.delay(100).animate({ 
      "left":"50px" 
     },150,'linear'); 
     slideright.delay(550).animate({ 
      "left":"0px" 
     }, 100, 'swing'); 
     }, 
    function(){ 
     slideright.stop(true).animate({ 
      "left":"-50px" 
     },150,'linear'); 
     slideup.delay(100).animate({ 
      "left":"0px" 
     }, 150, 'linear'); 
     slideup.delay(100).animate({ 
      "bottom":"-100px" 
     },150,'linear'); 
     });