Materialise CSS Side-nav funktioniert nicht

Question

Ich habe eine Grundeinstellung von Materialise läuft und alles scheint in Ordnung zu sein, außer für das Ausschieben Side-Nav.

Hier ist mein Code. Menü:

<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> 

ich die entsprechende Hamburger-Menü, wenn die Bildschirmgröße zu reduzieren, jedoch die Hamburger Klick ein Menü nicht erweitern aus. Die URL wird mit einem Hash # aktualisiert und das war's. In meiner JS-Ausgabe werden keine Fehler gemeldet.

Mit den anderen JS-Funktionen funktioniert das Dropdown-Menü und das Modal funktioniert. Stumped, warum Mr. SideNav nicht kooperiert.

Irgendwelche Ideen?

Answer 1

Ich fand eine Lösung. Ich nahm den Init-Hack von Materialize: http://materializecss.com/templates/starter-template/js/init.js und stellte dann sicher, dass es zuletzt in meinem JS aufgerufen wurde. (Setzen Sie es vor dem Rest des JS verursacht es zu scheitern.)