单击按钮和侧面菜单从隐藏中滑出

Question

我想制作类似m.facebook.com所做的导航菜单。但是这个，我想让它很好地从网站的左侧滑出。

流量:: 单击按钮>（菜单默认为隐藏）菜单滑出，将主容器向右推一点以适应菜单>再次单击>菜单再次滑入并再次隐藏。

我不知道如何使用javascript或jquery或ajax，而我是新的Web开发和有太多的影响脚本语言。我可以知道实现这一点，这是完美的光滑？

Answer 1

东西沿着这些路线... http://jsfiddle.net/HfdXY/

HTML：

<div id="menu">Menu</div> 

<button id="openMenu">Toggle menu</button>​ 

CSS：

#menu { 
    height: 300px; 
    width: 0px; 
    border: 1px solid black; 
    display: none; 
}​ 

JS：

$("#openMenu").click(function() { 
    var menu = $("#menu"); 
    if ($(menu).is(":visible")) { 
     $(menu).animate({width: 0}, 1000, function() {$(menu).hide();}); 
    } else { 
     $(menu).show().animate({width: 100}, 1000);   
    } 
});​