Materialise CSS 侧边导航不工作

Question

我有一个 Materialize 运行的基本设置，一切似乎都很好，除了滑出侧导航。

这是我的代码。菜单：

<ul class="right hide-on-med-and-down">
    <li><a class="dropdown-button" data-constrainwidth="false" data-beloworigin="true" data-activates="about-drop" href="#!">About<i class="material-icons left">arrow_drop_down</i></a></li>
    <li><a class="modal-trigger" href="#signup">Signup</a></li>
    <li><a class="modal-trigger" href="#sign-in">Sign In</a></li>
</ul>

<ul id="slide-out" class="side-nav">
    <li><a href="#">About</a></li>
    <li><a href="#">Signup</a></li>
    <li><a href="#">Sign In</a></li>
</ul>

<a href="#" data-activates="slide-out" class="button-collapse"><i class="material-icons">menu</i></a>

JS:

<script>
$(".dropdown-button").dropdown();
$(".button-collapse").sideNav();
$(document).ready(function(){
    $('.modal-trigger').leanModal();
});
</script>

我在缩小屏幕尺寸时得到了相应的汉堡包菜单，但是，单击汉堡包并没有展开菜单。 URL 使用散列 # 更新，仅此而已。我的 JS 输出中没有报告错误。

对于其他 JS 函数，下拉菜单和模式都有效。对 sideNav 先生为何不合作感到困惑。

有什么想法吗？

Answer 1

我找到了解决办法。我从 Materialize: http://materializecss.com/templates/starter-template/js/init.js 中获取了 init hack，然后确保它是在我的 JS 中最后调用的。（将它放在 JS 的其余部分之前会导致它失败。）

Materialise CSS 侧边导航不工作

Materialize CSS side-nav not working

javascript

materialize

material-design