Materialize.css向右滑动以打开菜单

Question

我知道Materialize.css有一个选项可以向左滑动以关闭打开的侧面菜单，但是可以通过向右滑动打开菜单，就像在大多数Android手机中找到的那样。

我有一个Android应用程序的meteor.js实现，并想知道这样的功能是否开箱即用。

Answer 1

是的，这可能是out of the box：

只需initialize the plugin就像这样：

// Initialize collapse button
$(".button-collapse").sideNav();

Demo in Plunker

Stack Snippets中的演示

$(".button-collapse").sideNav();

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.js"></script>

<nav>
  <ul class="right hide-on-med-and-down">
    <li><a href="#!">First Sidebar Link</a></li>
    <li><a href="#!">Second Sidebar Link</a></li>
  </ul>
  <ul id="slide-out" class="side-nav">
    <li><a href="#!">First Sidebar Link</a></li>
    <li><a href="#!">Second Sidebar Link</a></li>
  </ul>
  <a href="#" data-activates="slide-out" class="button-collapse"><i class="mdi-navigation-menu"></i></a>
</nav>

要进行测试，只需在Chrome开发者工具中启用仿真，重新加载页面，然后从边缘滑入。