在materializecss中，如何从右侧而不是默认左侧打开滑出菜单？答案

【问题标题】：In materializecss, how to open the slide-out menu from right rather than default left?在materializecss中，如何从右侧而不是默认左侧打开滑出菜单？
【发布时间】：2015-09-14 10:11:31
【问题描述】：

在物化 CSS 中，汉堡菜单默认在左侧。我更改了 CSS 并实现了它。但是单击时，侧导航仍然从左侧滑出。我参考了文档，但没有找到用于切换菜单的类。我试过edge: right，但没用。

我希望菜单在单击汉堡图标时从右侧滑出。提前谢谢你

【问题讨论】：

在此处添加您的相关代码。
你看过这个吗？ materializecss.com/side-nav.html - “边缘”旁边的“选项”部分，您可以在其中指定菜单的水平原点

标签： javascript jquery html css

【解决方案1】：

我在http://jsfiddle.net/8tw2u80q/3/ 让你成为了一个小提琴手。希望对您有所帮助。

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

你需要设置 edge: right。

【讨论】：

【解决方案2】：

这就是我在您问题下方的评论中的意思，在您初始化菜单后，您可以使用 jquery 指定您想要的正确选项，并在右侧而不是左侧弹出菜单。

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

一旦您处于正确的屏幕尺寸以显示移动菜单，这将移动菜单以在右侧弹出打开

【讨论】：