用CSS关闭jQuery UI手风琴

Question

有没有办法强制jQuery UI手风琴与CSS关闭直到页面加载完成？我们正在内容管理系统上使用它，每个页面都需要花费一定的时间来加载。在页面完成加载之前，jQuery不会触发，但是哪一点，所有的手风琴都已经扩展了。它们在页面加载后关闭，但我觉得用户看到一大堆东西出现然后消失，这让人感到困惑。

Answer 1

有一个在.accordion({ ... })调用本身的选项：

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

的active: false选项使得封闭创建和collapsible: true选项可以让您可以重新关闭它，一旦你打开它。

Answer 2

该选项显示如何在所有选项卡关闭的情况下初始化手风琴。请参阅：http://jqueryui.com/demos/accordion/#option-active这意味着初始化代码将是：

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

Answer 3

继从jQuery手风琴documentation的设置，你可以简单地把<div style="display: none">下面的H3头内容DIV。这会在页面加载时隐藏手风琴中的所有内容。

Answer 4

您可以设置它想：

.accordion-body{ 
    display: none; 
} 

我想这将手风琴调用$ .show（或类似）的地方，这样你就不会需要担心再次显示它。再次，这是一个猜测，所以我错了的情况下，就使其可见再次使用

$('.accordion-body').css('display', 'block'); 
$('#accordion').accordion(); 

但是，如果你在DOM加载调用.accordion()，你也可以尝试发射它较早，使用。负载：

$('#accordion').load(function(){ 
    $(this).accordion(); 
}); 

Answer 5

你可以尝试这样的事：

在你的CSS，样式应用于您使用调用手风琴选择：

.accordionSelector > div { display:none; } 

然后改变display回block jQuery的加载后：

$(".accordionSelector").accordion({...}).children("div").css("display","block");