MaterialiseCSS - 如何關閉手機菜單

我使用框架CSS Materialize，但我遇到了問題。點擊鏈接時如何關閉左側手機菜單？默認情況下，只有在菜單外單擊時，菜單纔會關閉。所以我嘗試了功能removeMenu（），但它不起作用。任何人都有解決方案？這是我的菜單：MaterialiseCSS - 如何關閉手機菜單

<div class="navbar-fixed"> 
     <nav class="orange darken-4" role="navigation"> 
     <div class="nav-wrapper container"> 
      <a id="logo-container" class="brand-logo"><img id="class" src="img/logo.png" class="nav_logo"></a> 
      <ul class="right hide-on-med-and-down"> 
      <li><a>test</a></li> 
      <li ><a>test2</a></li> 
      </ul> 

      <ul id="nav-mobile" class="side-nav"> 
      <li><a>test</a></li> 
      <li><a>test2</a></li> 
      </ul> 
      <a href="#" data-activates="nav-mobile" class="button-collapse" id="burger_menu"><i class="material-icons">menu</i></a> 
     </div> 
     </nav> 
    </div>

來源

2015-09-24 Pim

我找到了解決辦法：$（「＃NAV-移動麗」）點擊（函數（）{ $（）sideNav（ '按鈕崩潰。'。 'hide'）; }）; – Pim

可能希望將其添加爲答案。它實際上記錄在[這裏]（http://materializecss.com/side-nav.html#options）。 – Huey

記錄的解決方案也不適用於我。我不得不採取一些「黑客行爲」。這是我如何去做的。

我添加了一個按鈕到側邊導航與id="side-nav-clear"，點擊該按鈕我觸發點擊sidenav-overlay，這是用戶通常會隱藏side-nav的方式。這符合我的預期。

$("#side-nav-clear").on("click", function() { 
    $("#sidenav-overlay").trigger("click"); 
    return false; 
});

來源

2016-05-09 18:42:07 paulcik

好的！謝謝 – gael

添加closeOnClick

// Initialize collapse button 
$('.button-collapse').sideNav({ 
    menuWidth: 300, // Default is 240 
    edge: 'left', // Choose the horizontal origin 
    closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor 
    } 
);

來源

2016-07-04 13:57:13

MaterialiseCSS - 如何關閉手機菜單

回答

相關問題