javascript - Material design Lite - 导航锁定到位

Question

  <div class="mdl-layout__drawer">
        <span class="mdl-layout-title">SITE NAME</span>
        <nav class="mdl-navigation">
          <a class="mdl-navigation__link" href="">Link</a>
          <a class="mdl-navigation__link" href="">Link</a>
          <a class="mdl-navigation__link" href="">Link</a>
          <a class="mdl-navigation__link" href="">Link</a>
        </nav>
      </div>

您好，我想弄清楚如何让此菜单始终(除非移动设备)锁定在用户 View 内，并调整站点网格的大小。但是一次一步我如何锁定它(这样用户就无法关闭或打开)

Answer 1

请检查以下代码。固定抽屉的听写应该在抽屉上方的一个div类中。它取自 MDL 页面，https://getmdl.io/components/index.html#layout-section/layout并查看固定标题下，还有一个可用的代码笔。

<div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer">
  <div class="mdl-layout__drawer">
    <span class="mdl-layout-title">Title</span>
    <nav class="mdl-navigation">
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
    </nav>
  </div>
  <main class="mdl-layout__content">
    <div class="page-content">
      <!-- Your content goes here -->
    </div>
  </main>
</div>