JQUERY UI Запуск аккордеона свернут

82

Как я могу заставить аккордеон jquery UI начать сворачиваться при загрузке формы. Есть ли для этого какой-нибудь код javascript?

H Беллами
источник

Ответы:

198

В ваших опциях укажите:

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

См. Документацию для active .

топек
источник
все еще работает над JQuery 1.4.4 на сегодняшний день, хотя Visual Studio 2010 выдает ошибку JScript (нет ошибки в пользовательском интерфейсе) в IE 8
deltree
9

Я пытался сделать то же самое. Использование вкладок пользовательского интерфейса JQuery. Я хотел, чтобы при запуске не отображалось ни одной с 5 вкладками.

использование active: false показало содержимое 5-й вкладки. Поэтому я установил табуляции CSS для отображения: none; так как он на линии меняет отображение. Надеюсь, это кому-то поможет!

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

И в стиле

#tabs-1, #tabs-2, #tabs-3, #tabs-4, #tabs-5{ 
    display:none;
}
нононо нононо
источник
4

Я использовал этот код, так как использовал виджет Dreamweaver, код, который Topek мне не помог, надеюсь, это поможет,

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

    });
Линдон Джон Хаслам
источник
3

Чтобы завершить ответ topex , в JQuery UI 1.10.3 мне пришлось установить опцию «сворачиваемая» перед «активной».

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

См. Документацию

бакшаг
источник
1

Если вы используете wysiwyg «Свойства» и кодирование сбивает с толку, попробуйте поставить число в поле «Активный» на единицу больше, чем ваш список разделов. У меня 12 разделов, я поставил «13», и это сработало.

Стив
источник
1

Если вы используете jquery по умолчанию, он всегда отображает содержимое первой панели, вы можете отключить его с помощью active: falseатрибута.

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

но по умолчанию для всех панелей будет установлена ​​высота самой высокой панели. Итак, для этого вам нужно добавить "heightStyle"атрибут.

heightStyle: "content",

Таким образом, высота каждой панели будет равняться высоте ее содержимого.

Ашиш Патель
источник
0

Если вы посмотрите на начало группы панелей в своем коде, найдите это

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

если вы просто удалите "in", панель будет закрыта при загрузке страницы.

user6236374
источник