手風琴不適用，直到頁面加載完成

在頁面加載之前有一秒鐘的時間，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

回答