子菜单未显示 - 溢出隐藏？答案

【问题标题】：Submenu not showing - overflow hidden?子菜单未显示 - 溢出隐藏？
【发布时间】：2011-04-18 13:16:37
【问题描述】：

我的问题是我在名为“Productos”的第三个导航中有 3 个子菜单，但它们没有显示。

我认为错误可能与 jQuery 插件 kwicks 相关...使其溢出：隐藏；

我有点新，所以我会感谢你的帮助^^

Here is the link to the website

编辑：我删除了 kwicks，我可以看到子菜单，但我需要 kwicks，有没有办法绕过它？？

【问题讨论】：

你应该使用 kwicks 插件，否则独立尝试。我认为这应该可行。
我禁用了插件，我可以看到菜单，但我需要 kwicks，有没有办法绕过它？

标签： jquery css overflow submenu

【解决方案1】：

使用 Chrome，我可以看到您第一个菜单的一半，其中包含“Maquinaria”之类的文字。我认为菜单将显示在其容器内。

您是否尝试过设置更高的 z-index？

我还检查了开发者工具，溢出正确设置为可见。

编辑：

这是运行时生成的代码：

<li id="kwick_3" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; position: absolute; left: 225px; width: 200px; overflow-x: hidden; overflow-y: hidden; display: block; " class="active">
    <a class="headlink" href="#">Productos<h3>Nuestros productos</h3></a>
    <ul style="visibility: visible; display: block; ">
       <li><a href="#">Maquinaria pesada</a></li>
       <li><a href="#">Transporte</a></li>
       <li><a href="#">Agroindustria</a></li>
    </ul>
</li>

UL 元素的溢出（x 和 y）设置为可见。但是父 LI 元素的溢出（x 和 y）设置为隐藏

【讨论】：

我试试你说的，z-index 到 9999 什么都没有......是的，我确实把溢出设置为可见，但我认为 kwicks 把它变成了隐藏......但谢谢你的回答 ^ ^
没有。它设置为可见。如果你有 chrome，你可以使用开发者工具来查看运行时元素的计算样式。它向您展示了对 DOM 的动态更改等等...... ;

【解决方案2】：

您的li#kwick_3 元素在html 中设置了overflow: hidden，它覆盖了在css 中设置的overflow:visible。当我在 firebug 中禁用此设置时，子菜单选项会显示出来。

您还可以在 style.css 中为 #kwick_1, #kwick_2, #kwick_3, .. 设置 overflow: visible !important 以覆盖 html 中的设置（同样，在 firebug 中对我有用）。

【讨论】：

正是我想说的:)