加载时 JQuery Accordion 菜单闪烁答案

【问题标题】：JQuery Accordion Menu Flashes When Loading加载时 JQuery Accordion 菜单闪烁
【发布时间】：2011-05-20 07:14:52
【问题描述】：

我在一个站点上实现了一个 Jquery 菜单，但是每当我点击一个新页面时，菜单会下降一秒钟然后恢复正常。有谁知道这是为什么？

这里是链接：http://www.knowledgecity.com/alj/ 单击第一个菜单项“实际行动”，然后单击该菜单中的第一项。随着新页面的加载，菜单会移动一点。在 IE 中试一下。

提前感谢您的帮助。

大卫

【问题讨论】：

【解决方案1】：

诀窍是隐藏您的手风琴内容，然后在调用手风琴时显示。这将防止您看到的轻弹。

例子

CSS

#element{
 display:none;
}

jQuery

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

【讨论】：

【解决方案2】：

在您的 div 中持有水平的“Prida | Business | Computer”菜单，您可以添加一个嵌套的 div 并使用 css 给它一个固定的高度。它的动作很跳跃，因为在 DOM 加载后，这个菜单只是一个文本列表。然后将样式注入您的代码并最终应用于菜单。

目前你有：

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

我会尝试：

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

或者，将具有固定高度的 div 粘贴到您的 <li> 元素之一：

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

【讨论】：