Componente mínimo de pestañas limpias con vanilla JavaScript-Tabs. js
| Autor: | alexgleason |
|---|---|
| Views Total: | 3,834 |
| Sitio oficial: | Ir a la web |
| Actualizado: | March 23, 2016 |
| Licencia: | MIT |
Vista prévia
Descripción
Tabs. js es un componente de pestañas mínimo, limpio y de alto rendimiento creado con JavaScript y SCSS sin dependencias.
Funcionamiento
Coloque el archivo CSS Tabs. CSS en el encabezado de su página HTML.
<link href="tabs.css" rel="stylesheet">
Cree el componente de pestañas a partir de anotaciones HTML semánticas y simples.
<div class="tabs"> <div class="tab"> <a class="tab-button" href="#">Item 1</a> <div class="tab-content"> <p>Content 1</p> </div> </div> <div class="tab"> <a class="tab-button" href="#">Item 1</a> <div class="tab-content"> <p>Content 2</p> </div> </div> <div class="tab"> <a class="tab-button" href="#">Item 1</a> <div class="tab-content"> <p>Content 3</p> </div> </div> <div class="tab"> <a class="tab-button" href="#">Item 1</a> <div class="tab-content"> <p>Content 4</p> </div> </div> </div>
Coloque el archivo JavaScript Tabs. js justo antes de cerrar la etiqueta body. Eso es todo.
