Materialize CSS side-nav không hoạt động

Question

Tôi có một thiết lập cơ bản của Materialize đang chạy và mọi thứ có vẻ là tốt, ngoại trừ cho slide-side-nav.

Đây là mã của tôi. 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> 

tôi nhận được đơn bánh hamburger thích hợp khi giảm kích thước màn hình, tuy nhiên, cách nhấn vào bánh hamburger không mở rộng ra một menu. URL cập nhật với một băm # và đó là nó. Không có lỗi nào được báo cáo trong đầu ra JS của tôi.

Với các chức năng JS khác, menu thả xuống hoạt động và phương thức hoạt động. Stumped là tại sao ông sideNav không hợp tác.

Bất kỳ ý tưởng nào?

Answer 1

Tôi đã tìm thấy giải pháp. Tôi nắm lấy init init từ Materialize: http://materializecss.com/templates/starter-template/js/init.js và sau đó chắc chắn rằng nó được gọi là cuối cùng trong JS của tôi. (Đặt nó trước khi phần còn lại của JS làm cho nó thất bại.)