Navegación a pantalla completa ligera con menú de hamburguesa-Burger
| Autor: | mblode |
|---|---|
| Views Total: | 4,882 |
| Sitio oficial: | Ir a la web |
| Actualizado: | April 6, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
Burger. js es una pequeña biblioteca de JavaScript que utiliza animaciones CSS3 para revelar una navegación a pantalla completa con un menú de alternancia de hamburguesas animadas.
Funcionamiento
Incluye el JavaScript y la hoja de estilos de Burger en tu página web.
<link rel="stylesheet" href="css/burger.min.css"> <script src="scripts/burger.min.js"></script>
Crear el código HTML para la navegación a pantalla completa utilizando HTML lista desordenada.
<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>
Cree un icono de hamburguesa que actúe como botón de alternancia para la navegación a pantalla completa.
<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>
