Componente mínimo de navegación de cajón con JavaScript puro-tinyDrawer. js
| Autor: | jenstornell |
|---|---|
| Views Total: | 650 |
| Sitio oficial: | Ir a la web |
| Actualizado: | February 24, 2019 |
| Licencia: | MIT |
Vista prévia
Descripción
tinyDrawer. js es un componente de navegación de cajón pequeño y de dependencia cero para deslizar en un menú OFF-Screen desde la izquierda cuando toggled.
Funcionamiento
Cargue la hoja de estilos principal en la sección principal del documento.
<link rel="stylesheet" href="assets/css/dist/core.min.css">
El HTML para el componente de navegación del cajón.
<drawer-menu class="menu"> Your Navigation Here <div data-drawer-close>Close</div> </drawer-menu>
Inserte un botón de alternancia de menú en el documento.
<div data-drawer-open>Toggle Menu</div>
Cargue la versión minimizada de la biblioteca tinyDrawer. js justo antes de la etiqueta body de cierre.
<script src="assets/js/tinyDrawer.min.js"></script>
Inicializar el componente tinyDrawer. Hecho.
TinyDrawer.init();
Ejecute una función de devolución de llamada cuando la navegación del cajón se abra o se cierre.
TinyDrawer.init({
callback: function(element, action) {
console.log(element);
console.log(action);
}
}); Abra & cierre la navegación del cajón mediante programación.
instance.open(); instance.close();
Registro de cambios
02/24/2019
- Solucionado bug con la devolución de llamada abierta desencadenada por método.
- Se han añadido algunas pruebas feas pero útiles en el HTML.
