html - attribute - arranque inicial elemento colapsado

style html

Question

Estoy usando la plantilla de bootstrap y me gustaría cambiar la forma en que funciona el accordion de forma predeterminada.

¿Cómo puedo hacer que la palanca se cierre cuando la página se ve por primera vez (con carga)?

<div class="accordion-heading">
    <a class="accordion-toggle"
       data-toggle="collapse"
       data-parent="#accordion2"
       href="#collapseOne">Open!</a>
</div>
<div id="collapseOne" class="accordion-body collapse in">
    <div class="span6">
        <div class="well well-small">
            <div class="accordion-toggle">
                ...some text...
            </div>
        </div>
    </div>
    <div class="span2"></div>                            
</div>

Answer 1

Cuando expandes o contraes el acordeón, simplemente agrega / elimina una clase "in" y establece la height:auto o 0 en el accordion div.

Demo

Entonces, en su acordeón cuando lo defina, simplemente elimine la clase "en" del div como se muestra a continuación. Cada vez que expandes un accorion solo agrega la clase "in" para hacerlo visible.

Si renderizas la página con "in", bootstrap busca la clase y hará que la altura de div sea: auto, si no está presente, estará a cero altura.

<div id="collapseOne" class="accordion-body collapse">

Answer 2

Debes eliminar "en" de "colapsar"

Answer 3

Otra solución es agregar toggle = false al objetivo de colapso, esto lo detendrá al abrir y cerrar al azar, lo que sucede si solo quita el "in"

p.ej

<div class="accordion-heading">
    <a class="accordion-toggle"
        data-toggle="collapse"
        data-parent="#accordion2"
        href="#collapseOne">Open!</a>
</div>
<div
    id="collapseOne"
    class="accordion-body collapse"
    data-toggle="false"
    >
    <div class="span6">
        <div class="well well-small">
            <div class="accordion-toggle">
                ...some text...
            </div>
        </div>
    </div>
    <div class="span2"></div>                            
</div>

Answer 4

Si eliminar la clase no funciona para usted, tal fue mi caso, puede forzar el estado inicial contraído utilizando la propiedad de visualización de CSS:

...
<div id="collapseOne" class="accordion-body collapse" style="display: none;">
...