Skip to content
Chubby fullscreen menu with nice hamburger toggle
Branch: master
Clone or download
Glitchbone Merge pull request #10 from bryant1410/master
Fix broken headings in Markdown files
Latest commit 9fd468f Sep 8, 2017
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
demo Updated demo Apr 17, 2015
dist build update Aug 14, 2015
src Removed scrollbar hack Aug 14, 2015
.gitignore Initial commit Apr 17, 2015
Gruntfile.js Initial commit Apr 17, 2015
LICENSE Initial commit Apr 17, 2015
README.md Fix broken Markdown headings Apr 18, 2017
bower.json Updated version number Apr 17, 2015
index.html Disable zoom Apr 17, 2015
package.json Updated description and urls Apr 17, 2015

README.md

jQuery fatNav

Chubby fullscreen menu with nice hamburger toggle

Demo

Installation

Install via bower:

bower install jquery-fatNav

Or you can add jquery.fatNav.css and jquery.fatNav.js manually to your project

Usage

Create the menu in your HTML:

<div class="fat-nav">
    <div class="fat-nav__wrapper">
        <ul>
            <li><a href="#">Menu item</a></li>
            <li><a href="#">Menu item</a></li>
            <li><a href="#">Menu item</a></li>
            <li><a href="#">Menu item</a></li>
        </ul>
    </div>
</div>

Call the javascript function:

$.fatNav();

Customizing hamburger color

Default state:

.hamburger .hamburger__icon, 
.hamburger .hamburger__icon:before, 
.hamburger .hamburger__icon:after {
    background-color: red;
}

Close button state:

.hamburger.active .hamburger__icon:before, 
.hamburger.active .hamburger__icon:after {
    background-color: green;
}

Build

git clone https://github.com/Glitchbone/jquery-fatNav.git my_project
npm install
grunt

Author

Adrien Glitchbone

License

jQuery fatNav is available under the MIT license. See the LICENSE file for more information.

You can’t perform that action at this time.