Author: | mblode |
---|---|
Views Total: | 5,057 views |
Official Page: | Go to website |
Last Update: | April 6, 2015 |
License: | MIT |
Preview:

Description:
Burger.js is a small JavaScript library that uses CSS3 animations to reveal a fullscreen navigation with an animated hamburger toggle menu.
How to use it:
Include the Burger’s JavaScript and stylesheet in your webpage.
<link rel="stylesheet" href="css/burger.min.css"> <script src="scripts/burger.min.js"></script>
Create the Html for the fullscreen navigation using Html unordered list.
<div class="burger-nav"> <li><a class="burger-link active" href="#">Home</a></li> <li><a class="burger-link" href="#">Blog</a></li> <li><a class="burger-link" href="#">Portfolio</a></li> <li><a class="burger-link" href="#">About</a></li> <li><a class="burger-link" href="#">Contact</a></li> </div>
Create a hamburger icon that acts as the toggle button for the fullscreen navigation.
<div class="burger-contain"> <div class="burger"> <div class="bun bun-top"></div> <div class="bun bun-mid"></div> <div class="bun bun-bottom"></div> </div> <a href="#" class="burger-brand">Burger</a> </div>