examples - JQUERY UI Accordion start se colapsó

jquery ui accordion events

Question

¿Cómo puedo hacer que el acordeón de la interfaz de usuario de jquery comience a colapsarse cuando se carga el formulario? ¿Hay algún código de JavaScript para esto?

Answer 1

En tus opciones especifica:

{
  ...
  active: false,
  collapsible: true,
  ...
}

Ver documentación para active .

Answer 2

Intentaba hacer lo mismo. Uso de las pestañas de IU de Jquery. No quería mostrar ninguno con 5 pestañas cuando comienzas.

usando active: false mostró el contenido de 5 tabs. Así que establecí las pestañas CSS para mostrar: ninguna; ya que se muestran los cambios en línea. ¡Espero que esto ayude a alguien!

<script>
$(function() {
    $( "#tabs" ).tabs({
        active: false,
        collapsible: true,
    });
});

Y en el estilo

#tabs-1, #tabs-2, #tabs-3, #tabs-4, #tabs-5{ 
    display:none;
}

Answer 3

Para completar la respuesta de topex , con Jquery UI 1.10.3 tuve que configurar la opción ''plegable'' antes que la ''activa''.

$( ".accordion" ).accordion("option", { 
    collapsible: true,
    active: false
});

Ver la active

Answer 4

Si está utilizando el acordeón de jquery predeterminado, siempre muestra el primer contenido del panel, puede deshabilitarlo usando el atributo active: false .

jQuery(document).ready(function() {
    jQuery( "#accordion" ).accordion({
      collapsible: true,
      active: false,
    });
});

pero su comportamiento predeterminado es que todos los paneles estén configurados a la altura del panel más alto. entonces, para eso tienes que agregar el atributo "heightStyle" .

heightStyle: "content",

por lo tanto, cada panel será tan alto como su contenido.

Answer 5

Si está utilizando las "Propiedades" wysiwyg y la codificación confunde, intente poner un número en el cuadro "Activo" más que su lista de Secciones. Tengo 12 secciones y puse "13" allí y funcionó para mí.

Answer 6

Si observa el comienzo del grupo de paneles en su código, busque esto

<div id="collapseOne1" class="panel-collapse collapse in"> 

si solo quita la "entrada", tiene el panel cerrado cuando se carga la página.

Answer 7

Usé este código, ya que estaba usando un widget de Dreamweaver, el código que Topek no me funciona espero que esto ayude,

jQuery("#jQueryUIAccordion").accordion({ 
        event: "click",
        active: false,
        collapsible: true,
        autoHeight: false

    });