【jQuery】レスポンシブでも使えるオフスクリーンナビゲーションプラグイン。okayNav

okayNavはレスポンシブにも対応したオフスクリーンナビゲーションプラグイン。

HTML

<header id="header">
<a class="site-logo" href="#">
Logo
</a>
<nav role="navigation" id="nav-main" class="okayNav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Shop</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contacts</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Testimonials</a></li>
</ul>
</nav>
</header><!-- /header -->

CSS

<link rel="stylesheet" href="css/okayNav.css" media="screen">

JS

<script src="js/jquery.okayNav.min.js"></script>

オプション

var navigation = $('#nav-main').okayNav({
parent : '', // will call nav's parent() by default
toggle_icon_class : 'okayNav__menu-toggle',
toggle_icon_content: '<span /><span /><span />',
beforeopen : function() {}, // Will trigger before the nav gets opened
open : function() {}, // Will trigger after the nav gets opened
beforeclose : function() {}, // Will trigger before the nav gets closed
close : function() {}, // Will trigger after the nav gets closed
});

ライセンスはMIT

 
okaynav

【jQuery】レスポンシブでも使えるオフスクリーンナビゲーションプラグイン。okayNav

  • LATEST
  • RELATED
  • POPULAR