Akordeon JQUERY UI zaczął się zwinąć

82

Jak sprawić, by akordeon jquery UI zaczął się zwijać po załadowaniu formularza. Czy jest do tego jakiś kod javascript?

H Bellamy
źródło

Odpowiedzi:

198

W opcjach określ:

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

Zobacz dokumentację dla aktywnych .

topek
źródło
nadal pracuję nad JQuery 1.4.4 na dzień dzisiejszy, chociaż Visual Studio 2010 generuje błąd JScript (brak błędu w interfejsie użytkownika) w IE 8
deltree
9

Próbowałem zrobić to samo. Korzystanie z kart interfejsu użytkownika Jquery. Chciałem, żeby na początku nie było widać żadnych z 5 zakładkami.

użycie active: false pokazało zawartość piątej zakładki. Więc ustawiłem karty CSS do wyświetlania: brak; ponieważ zmienia wyświetlanie w linii. Mam nadzieję, że to komuś pomoże!

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

I w stylu

#tabs-1, #tabs-2, #tabs-3, #tabs-4, #tabs-5{ 
    display:none;
}
nie nie nie nie nie nie
źródło
4

Użyłem tego kodu, ponieważ korzystałem z Dreamweaver Widget, kodu, którego Topek nie działał dla mnie, mam nadzieję, że to pomoże,

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

    });
Lyndon John Haslam
źródło
3

Aby zakończyć odpowiedź topexu , w Jquery UI 1.10.3 musiałem ustawić opcję „zwijany” przed „aktywną”.

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

Zobacz dokumentację

shagshag
źródło
1

Jeśli używasz "Właściwości" wysiwyg i kodowanie jest niejasne, spróbuj wstawić liczbę w polu "Aktywne" o jedną więcej niż lista sekcji. Mam 12 sekcji i wstawiłem tam „13” i zadziałało.

Steve
źródło
1

Jeśli używasz domyślnego akordeonu jquery, zawsze wyświetla on zawartość pierwszego panelu, możesz go wyłączyć za pomocą active: falseatrybutu.

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

ale jego domyślne zachowanie jest takie, że wszystkie panele zostaną ustawione na wysokość najwyższego panelu. więc w tym celu musisz dodać "heightStyle"atrybut.

heightStyle: "content",

więc każdy panel będzie tak wysoki, jak jego zawartość.

Ashish Patel
źródło
0

Jeśli spojrzysz na początek grupy paneli w swoim kodzie, poszukaj tego

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

jeśli usuniesz tylko „in”, panel zamknie się po załadowaniu strony.

user6236374
źródło