MaterializeCss:更新后,SideNav无法正常工作

时间:2016-11-10 11:55:11

标签: javascript html css materialize

我最近将项目中Materializecss设计的css / js文件从v0.97.5更新为v0.97.8。

我认为这不会产生太大的影响但是我的SideNav不再正常工作了。当我点击菜单时,它会滑出但黑暗的叠加层在整个屏幕上,我无法点击任何内容。这就是它的样子:

enter image description here

看起来像'sidenav-overlay'div的不透明度高于sideNav。另外,我无法点击此sideNav内的任何菜单。

这个的实现基本上类似于文档中提到的。我不确定这里有什么改变。

EDIT1: 我的代码 -

<div class="navbar-fixed">
  <nav>
    <div class="nav-wrapper light-blue lighten-1">
      <ul id="slide-out" class="side-nav hide-on-med-and-down print-hidden">
        <li><a href="#!">Upload<i class="material-icons right">cloud_upload</i></a></li>
        <li class="divider"></li>
        <li class="div-title">Admin</li>

        <li><a href="/admin/users">Users</a></li>
        <li><a href="/admin/roles">Roles</a></li>
      </ul>

      <a href="#" data-activates="slide-out" class="button-collapse show-on-large"><i class="material-icons">view_headline</i></a>

      <a href="#" class="brand-logo">LOGO</a>
    </div>
  </nav>
</div>

1 个答案:

答案 0 :(得分:1)

解决这个问题的原因是我的side-nav ul列表位于navbar-fixed div内。这在以前的版本中不是问题,但出于某种原因,这打破了当前的0.97.8版本。

只需移动导航栏部分外的side-nav即可。希望这可以帮助处于相同情况的其他人。