Acordeón
El accordion es una lista de elementos o secciones apiladas verticalmente, cada uno de estos elementos se puede expandir o contraer para revelar o esconder su contenido. El acordeón puede presentarse en la página web con todas las secciones contraídas, con una sección expandida o más de una sección expandida.
Uso
Copias el snippet HTML y ten en cuenta:
- El elemento con la clase nkn-accordion es el contenedor de todas las secciones apiladas dentro del accordion.
- El elemento con la clase nkn-accordion-item es una sección del accordion, que está compuesta por el título y contenido.
- Elemento con la clase nkn-accordion-heading es título de la sección de acordeón. Debe tener el atributo data-nkn-role = "accordion-toggle" , para tener la funcionalidad de expandir o contraer la sección del accordion.
- En el elemento con la clase nkn-icon-toggle va el icono del acordeón, este debe ir dentro del elemento con la clase nkn-accordion-heading
- El elemento con la clase nkn-accordion-content es donde va el contenido del acordeón.
- Si desea cargar el documento con una sección del acordeón expandida puede hacer uso de la clase nkn-open junto a la clase nkn-accordion-item.
Ejemplo
Snippet HTML
Modo de uso
Expandir una sección de acordeón a la vez
Para expandir una sección de acordeón a la vez; usar la clase nkn-open-only-one junto a la clase nkn-accordion.