JQuery UI аккордеон начало рухнул

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

7 78
jquery accordion jquery-ui-accordion

7 ответов:

в настройках укажите:

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

см. документацию для активный.

186

Я пытался сделать то же самое. Использование вкладок пользовательского интерфейса 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;
}
8

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

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

    });
4

завершить ответ topex, С jQuery UI 1.10.3 мне пришлось установить опцию "складная" перед "активной".

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

посмотреть документация

3

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

1

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

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

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

0

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

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

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

heightStyle: "content",

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

0