mmenu：一个容器中的两个菜单答案

【问题标题】：mmenu: Two menus in one containermmenu：一个容器中的两个菜单
【发布时间】：2015-08-15 11:36:05
【问题描述】：

是否可以在一个 jQuery.mmenu-sliding 容器中拥有两个菜单？在我的示例中，第二个导航被删除或隐藏。这个可以改吗？

标记看起来像这样：

<script>
$(document).ready(function(){
  $("#sidebar-offcanvas").mmenu({});
});
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.3.4/js/jquery.mmenu.min.all.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.3.4/css/jquery.mmenu.min.css" rel="stylesheet"/>

<header>
    HEADER
</header>
<main>
    CONTENT
    <a href="#sidebar-offcanvas">Open the menu</a>

    <div id="sidebar-offcanvas">
        <div id="mainNavi">
            <nav>
                <ul role="menubar">
                    <li><a href="#">Main 1</a></li>
                    <li><a href="#">Main 2</a></li>
                    <li><a href="#">Main 3</a></li>
                </ul>
            </nav>
        </div><!-- /#mainNavi -->
        
        <div id="metaNavi">
            <nav>
                <ul role="menubar">
                    <li><a href="#">Meta 1</a></li>
                    <li><a href="#">Meta 2</a></li>
                    <li><a href="#">Meta 3</a></li>
                </ul>
            </nav>
        </div><!-- /#metaNavi -->
    </div><!-- /#sidebar-offcanvas -->
</main>

<footer>FOOTER</footer

小提琴： http://jsfiddle.net/up7s9xyn/

【问题讨论】：

标签： jquery mmenu

【解决方案1】：

自己找到了答案：

两个菜单需要包装在一个容器中：

<div id="sidebar-offcanvas">
    <div class="wrapper">
        <div id="mainNavi">
            <nav>...</nav>
        </div>
        <div id="metaNavi">
            <nav>...</nav>
        </div>
    </div>
</div>

找到代码层： http://jsfiddle.net/up7s9xyn/1/

【讨论】：