JQuery手風琴菜單在加載時閃爍

Question

我在網站上實現了一個Jquery菜單，但每當我點擊一個新頁面時，菜單就會下降一秒鐘，然後恢復正常。有人知道爲什麼嗎？

這裏是鏈接：http://www.knowledgecity.com/alj/ 點擊第一個菜單項「務實行事」，然後點擊該菜單中的第一項。隨着新頁面的加載，菜單會稍微移動一點。在IE中試用。

非常感謝您的幫助。

大衛

Answer 1

在你的DIV持有水平「普里達|商務|電腦」菜單，你可以添加一個div嵌套，並給它用CSS固定的高度。由於在DOM加載之後，這個菜單只是一個文本列表，所以表演很刺激。樣式然後被注入您的代碼並最終應用於菜單。

目前您有：

<div id="tabs"> 
    <ul> ... </ul> 
</div> 

我會嘗試：

<div id="tabs"> 
    <div id="tabsContainer" style="height:42px"> 
     <ul> ... </ul> 
    </div> 
</div> 

或者，您<li>元素之一堅持一個div固定的高度：

<div id="tabs"> 
    <ul> 
     <li><div style="height:42px"></div>...</li> 
     ... 
    </ul> 
</div> 

Answer 2

訣竅是隱藏手風琴內容，然後在手風琴調用時顯示。這將防止你看到的輕彈。

例如

CSS

#element{ 
display:none; 
} 

的jQuery

$('#element').accordion().show();