Я хочу создать меню администратора. Внутри моего Navbar я хочу добавить значок, и когда вы нажимаете значок, появляется sidenav. Но дело в том, что когда я копирую, вставляю код из Materialise doc Это работает, когда я вставляю
<a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a>
Когда я помещаю эту строку внутрь nav
, значок меню и текст не появляются, и я не знаю почему ...
Вне тега Nav:
Может появиться sidenav:
Но я поместил ссылку внутри моей панели навигации:
Вот мой код:
HTML:
<nav>
<div class="nav-wrapper">
<a href="#" class="brand-logo">Logo</a>
<ul id="nav-mobile" class="right hide-on-med-and-down">
<li><a href="#" data-target="slide-out" class="sidenav-trigger">menu</a></li>
</ul>
</div>
</nav>
<ul id="slide-out" class="sidenav">
<li><div class="user-view">
<div class="background">
<img src="#">
</div>
<a href="#user"><img class="circle" src="#"></a>
<a href="#name"><span class="white-text name">John Doe</span></a>
<a href="#email"><span class="white-text email">jdandturk@gmail.com</span></a>
</div></li>
<li><a href="#!"><i class="material-icons">cloud</i>First Link With Icon</a></li>
<li><a href="#!">Second Link</a></li>
<li><div class="divider"></div></li>
<li><a class="subheader">Subheader</a></li>
<li><a class="waves-effect" href="#!">Third Link With Waves</a></li>
</ul>
А внутри моего app.js
:
M.AutoInit();
$(document).ready(function(){
$('.modal').modal();
$('.sidenav').sidenav({
menuWidth: 300, // Default is 240
edge: 'left', // Choose the horizontal origin
closeOnClick: true // Closes side-nav on <a> clicks, useful for Angular/Meteor
}
);
});
У меня заканчиваются идеи, я не понимаю, почему это не появляется ..