Efecto acordeón Jquery Mobile

Accordions - Acordeón

Este tipo de componentes permite crear grupos de botones que pueden plegarse (ocultando) y desplegarse mostrando el contenido asignado al  elemento único collapsible.

Para crear un grupo acordeón se indica en el atributo data-role el valor collapsible-set, y para indicar cada elemento collapsible que integrará  el grupo se indica en el atributo data-role el valor collapsible.

El código del ejemplo está debajo de la imagen.

<div data-role="collapsible-set" data-theme="c" data-content-theme="d">
<div data-role="collapsible">
<h3>Sección 1</h3>
<p>Yo soy el contenido de la tecla de acordeón nº 1</p>
</div>
<div data-role="collapsible">
<h3>Sección 2</h3>
<p>Yo soy el contenido de la tecla de acordeón nº 2</p>
</div>
<div data-role="collapsible">
<h3>Sección 3</h3>
<p>Yo soy el contenido de la tecla de acordeón nº 3</p>
</div>
</div>