用于滑动菜单的 jQuery 插件（如 mmenu）答案

【问题标题】：jQuery plugins for a sliding menu (like mmenu)用于滑动菜单的 jQuery 插件（如 mmenu）
【发布时间】：2014-02-07 09:13:08
【问题描述】：

我想知道是否有人知道一个插件，它允许您创建一个看起来像 iphone/android 的本机（某种）菜单并且与 jQuery 兼容的滑动菜单。

我尝试了 mmenu (http://mmenu.frebsite.nl)，但是当我将它集成到我的网站时它有点滞后，我想探索其他替代方案。

另外，你知道我是否可以用 Bootstrap 创建这个（虽然我从未尝试过 bootstrap）？

提前感谢您的支持和建议！

【问题讨论】：

标签： jquery html css jquery-plugins menu

【解决方案1】：

此链接将对您有所帮助。

http://www.programming-free.com/2013/02/responsive-navigation-menu-using.html

和

http://getbootstrap.com/components/

【讨论】：

如果这个答案帮助你解决了你的问题，你应该接受它。

【解决方案2】：

这是您在链接中显示的菜单的自定义代码。

CSS 代码

.deviceMenu {background:green; width:150px; height:250px; -webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out;}
    .btnMenu { width:70px; height:50px; background:yellow;}
    .show{ margin-left:150px;}

HTML 代码

<div class="deviceMenu">
   <div class="btnMenu">show/hide</div>
   </div>

jQuery 显示/隐藏菜单

$(document).ready(function() {

    $('.btnMenu').on('click', function(){
        var $$ = $(this),
            $menu = $$.parent();
        ( !$menu.is('.show')) ? $menu.addClass('show') : $menu.removeClass('show');

    });

});

工作示例：http://jsfiddle.net/5R7H2/

【讨论】：