Jquery动画滑动菜单

Question

我正在构建一个带有jQuery Mobile的网络应用程序，其中有一个滑出菜单，如Facebook应用程序。我的菜单运行良好，但我想在滑出时添加反弹效果。

这里是我有：

$("a.showMenu").click(function() { 
    if (menuStatus != true) { 
     $(".ui-page-active").animate({ 
      left: 250, 
     }, 400, function() { 
      menuStatus = true 
     }); 
     return false; 
    } else { 
     $(".ui-page-active").animate({ 
      left: 0, 
     }, 300, function() { 
      menuStatus = false 
     }); 
     return false; 
    } 
}); 

我的jQuery的技能是非常有限的。任何人都可以帮助我实现这一目标。

在此先感谢。

Answer 1

看看George McGinley Smith的easing plugin。

试试这个例子（未经测试）：

$("a.showMenu").click(function(){ 
    if(menuStatus != true){    
    $(".ui-page-active").animate({ 
     left: 250, 
     }, 400, 'easeOutBounce', function(){menuStatus = true}); 
     return false; 
     } else { 
     $(".ui-page-active").animate({ 
     left: 0, 
     }, 300, function(){menuStatus = false}); 
     return false; 
     } 
});