mmenu js API -菜单不显示

Question

我想使用mmenu，但我遇到了一些困难。

我能够建立并运行一个基本的示例，一切都很好。接下来，我尝试添加一个搜索域，但是搜索域没有显示。在这一点上，我意识到我正在使用的源js文件没有搜索字段附加组件。

在谷歌搜索之后，我发现了一个指向jquery.mmenu.all.js文件的链接，该文件应该包含所有的附加组件。但后来我遇到了另一个问题。您可以看到菜单的动画，但它显示为空白，因为它的css显示属性设置为“无”。

我使用下面的javascript来调用API。

var myMenu = $("#menu");

// initialize mmenu
myMenu.mmenu({
               "navbars": [
                  {
                     "position": "top",
                     "content": [
                        "searchfield"
                     ]
                  }
               ],
               "searchfield": {
                  "panel": true
               }
            }, {
               "searchfield": {
                  "clear": true
               }
            });

// initialize mmenu API
var myMenuAPI = myMenu.data( "mmenu" );


// function to set to specific subMenu
function setMMenu(subMenu) {
  // set to subMenu
  var current = myMenu.find(subMenu);

  // myMenuAPI.setSelected(current.first());
  myMenuAPI.openPanel(current.closest(".mm-panel")); 
}

// function to open mmmenu to specific subMenu
function openMMenu() {
  myMenuAPI.open();
}

你可以在这把小提琴上看到我的问题。

http://jsfiddle.net/6anbksxd/

你们能帮帮我吗？

提前感谢

Answer 1

请将这个添加到您的CSS中。

mm-menu.mm-offcanvas.mm-hasnavbar-top-1.mm-opened {
  display: block;
}

已更新JSFiddle。