okayNav

okayNav 是一款响应式导航菜单jQuery插件。

采用MIT协议。

它的源码网站https://github.com/VPenkov/okayNav

使用也特别简单:

引入css

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

引入js

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

因为它是基于jQuery,一定要引入jQuery哦。

编写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>

让菜单生效

var navigation = $('#nav-main').okayNav();

下载源码,源码中带有示例