Spry, como todo framework para AJAX de cierto nivel, contiene una serie de widgets que permiten mejorar la presentación de datos. Uno de ellos es elemento Accordion, que en la versión 1.3 presenta interesantes novedades.

Este elemento Accordion nos permite crear listados que pliegan y despliegan alternativamente a modo de persiana.
Para generarlo, sólamente es necesario enlazar con el archivo SpryAccordion.js del framework, lo que nos permite utilizarlo incluso con datos estáticos.
La estructura html del elemento es relativamente sencilla

  • Un bloque contenedor
    • Bloque de panel 1
      • Un bloque de pestaña/titulo
      • Un bloque de contenido
    • Bloque de panel 2
      • Un bloque de pestaña/titulo
      • Un bloque de contenido
    • …Bloque de panel n
      • Un bloque de pestaña/titulo
      • Un bloque de contenido

Estos bloques no necesitan ser obligatoriamente etiquetas div, sino que Spry es capaz de realizarlos con otros elementos html, como una lista.

Una enlazado al archivo creada la estructura de bloques, sólo nos queda instanciar el objeto:

La asignación a la variable nos permitirá realizar otrs acciones posibles, como abrir un determinado panel, crearlos al vuelo… El valor del parámetro es la id que asignemos al bloque que actua como contenedor.

En el ejemplo 1 podemos ver la estructura básica de un acordeón que utiliza una lista para presentar los datos.

Paginas: 1 2 3