手风琴不适用，直到页面加载完成

在页面加载之前有一秒钟的时间，jquery显然没有被应用，并且页面看上去与如果禁用javascript完全一样。然后，当页面完成加载jquery踢，手风琴看起来很完美。手风琴不适用，直到页面加载完成

问题是，每当页面刷新或导航时，它看起来真的很丑陋，我不知道为什么发生这种情况或如何解决这个问题。

有没有人有任何想法？

显示：没有任何帮助，但似乎主要问题是页面加载，正如Dominic所述。奇怪的是，它加载完美的铬，但仍然显示手风琴栏文本没有JavaScript预加载ff。感谢评论家伙！ – user1113531 2011-12-23 15:20:51

任何不会显示在默认的accordion视口中的元素都应该具有display none的CSS属性。

例子：

#sampleDiv{ 

    display:none; 
}

这应该可以解决闪烁的样子时，页面加载。

2011-12-23 14:23:19 laymanje

感谢帮助哥们。竖起大拇指.....这个温度适合完美。 – Akki619 2013-07-31 07:32:13

您的手风琴可能会在准备好的文档上运行，这是因为您的JavaScript需要等待您的元素被加载才能在其上工作。所以你的脚本不会直接启动，直到你的页面上的所有元素都被加载了，可能你的问题应该是为什么我的页面加载得太慢了，我的图片要大才是我的脚本大。

2011-12-23 14:24:08

这不是一个答案，因为它是一些指导。手风琴很容易用几行基本的jQuery创建。制作自己的手风琴将为您提供更多的灵活性和更少的开销。正如您在我的示例中看到的，.accBody div（其中包含辅助内容）被初始化为隐藏状态，因此在手动展开前它们永远不可见。

CSS

.accHeader{ 
    padding:2px; 
    background:#000; 
    color:#fff; 
    margin:2px; 
} 
.accBody{ 
padding:2px; 
display:none; 
}

HTML

<div class='accHeader'>Header</div> 
<div class='accBody'>Body</div> 

<div class='accHeader'>Header</div> 
<div class='accBody'>Body</div>

jQuery的

$('.accHeader').click(function(){ 
    $(this).next('.accBody').slideToggle('medium'); 
});

2011-12-23 14:30:51 Dutchie432

我做了什么，被设置display:none到具有整个手风琴，像这样的div：

<div id="accordion" style="display: none;"> 
     <h3 id="mark"> 
...

然后，在脚本标签，

jQuery(window).load(function(){ 
    var accc = document.getElementById('accordion'); 
    accc.style.display = "";  
});

对于半/整秒，而不是显示不完整的手风琴，我只看到一个空白页面，然后是手风琴。

2012-09-12 09:57:52 theTuxRacer

回答