Materialise CSS side-nav ne fonctionne pas

J'ai une configuration de base de Matérialiser la course et tout semble aller pour le mieux, sauf pour le coulissant côté-nav.

Voici mon code. Menu:

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

Je obtenir les hamburger menu lors de la réduction de la taille de l'écran, cependant, en cliquant sur le hamburger ne pas afficher un menu. L'URL de mise à jour avec un dièse # et c'est tout. Il n'y a aucune erreur dans mon JS sortie.

Avec les autres fonctions JS, le menu déroulant des œuvres et la modale de travaux. Perplexe pourquoi M. sideNav ne coopère pas.

Des idées?

source d'informationauteur Sheldon Scott