JQuery Mobile: haga un elemento plegable 100% ancho/no insertado

Question

¿Hay alguna manera de hacer un elemento plegable/establecido en jQuery mobile no insertado? Por defecto, hace que el elemento plegable sea un elemento de inserción.

data-inset="false" no altera el comportamiento.

Answer 1

Si le das al margin-left y margin-right Propiedades Un valor negativo puede expandir el contenido plegable al ancho de la página.

El valor por defecto margin-top y margin-bottom Los valores para un plegable son 8px Entonces podemos escribir una regla CSS para esto:

.ui-collapsible {
    margin : 8px -15px;
}

Elegí -15px Porque esa es la cantidad negativa de padding que el data-role="content" El elemento se suma a cada página.

Aquí hay un jsfiddle para ver lo que esto hace: http://jsfiddle.net/jasper/zsvqu/

Answer 2

Siempre puedes poner el bloque de contenido plegable en data-role="header", pero, por supuesto, esto solo está bien si su contenido plegable no necesita estar en el medio de su página.