jQuery

【jQuery】フルスクリーンメニューをハンバーガーアイコンで表示jQuery fullscreenMenu

January 14, 2017
jQuery-fullscreenMenu

jQuery fullscreenMenuはフルスクリーンメニューをアニメーションのハンバーガーアイコンで表示します。

Usage

HTMLにアイコンとメニューオーバーレイを作成

<div id="nav-icon1">
  <span></span>
  <span></span>
  <span></span>
</div>
<div id="overlay">
  <div>
      <ul>
        <li><a href="#">Menu item</a></li>
        <li><a href="#">Menu item</a></li>
        <li><a href="#">Menu item</a></li>
      </ul>
  </div>
</div>

CSS

<link rel="stylesheet" href="style.css">

JS

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="script.min.js"></script>

MIT
Download