0

我正在使用来自http://www.designchemical.com的 jquery Vertical Mega 菜单， 当我的页面加载它时，它首先显示所有菜单（包括子菜单）一瞬间呈现，然后子菜单消失，看起来像一个普通的垂直菜单。

我尝试使用为水平巨型菜单提供的以下解决方案，但这不起作用......

#mega-1 li ul {
    display: none;
}

#mega-1 .sub ul {
    display: block;
}

请建议如何使它工作

html代码

<ul id="mega-1" class="mega-menu">
    <li><a href="#">Menu Item A</a>
        <ul>
            <li><a href="#">Sub-Header 1</a>
                <ul>
                    <li><a href="#">Menu Link</a></li>
                    <li><a href="#">Menu Link</a></li>
                    <li><a href="#">Menu Link</a></li>
                </ul>
            </li>
            <li><a href="#">Sub-Header 2</a>
                <ul>
                    <li><a href="#">Menu Link</a></li>
                    <li><a href="#">Menu Link</a></li>
                    <li><a href="#">Menu Link</a></li>
                </ul>
            </li>
            <li><a href="#">Sub-Header 3</a>
                <ul>
                    <li><a href="#">Menu Link</a></li>
                    <li><a href="#">Menu Link</a></li>
                    <li><a href="#">Menu Link</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>
4

1 回答 1

0

如果没有看到要调试的页面，很难确定 100%，但我会想象以下......

为避免任何内容跳转，请确保使用 CSS 隐藏嵌套的 UL，并且不依赖 JavaScript 来隐藏子菜单。如果您使用的是 Firebug 或 Chrome，请在禁用 JavaScript 时检查代码，以确保没有样式覆盖您的 display:none; 在菜单项 A 正下方的第一个 UL 上。

此外，如果 的目的#menu .sub ul { display: block; }是让您的第二级嵌套 UL 保留为块元素，则您缺少其 LI 父级的 .sub 类，因此将 .sub 类添加到您的子标题 LI。

于 2013-03-12T13:50:10.197 回答