Drupal菜单上的悬停问题

Question

我有一个菜单，当用户将菜单悬停时，会出现子菜单。只是，当您不悬停文本时，子菜单会消失。

让我试着用图像说清楚 悬停文字时（如何）：
导致了这一点

悬停在文字附近的区域时：
导致了这一点

为了让它变得更加复杂，它只发生在Safari en Chrome（我猜的webkit引擎）中并且它不会一直这样做:)

我猜这是一个css问题，但有人知道在哪里看？

（哦，这是一个Drupal网站，所以我不知道它会一直播放......）

更新
这就是HTML的样子：

Answer 1

有些模块可以帮到你，比如Nice Menus。

子菜单可能不是DOM中父菜单的子菜单。它可能是这样的：

<ul id="parent">
    <li>menu item</li>
</ul>
<ul id="submenu">
    <li>menu item</li>
</ul>

因此，当您将鼠标悬停在子菜单上时，会在父级上触发mouseLeave / mouseOut。 您可以通过多种方式解决此问题。一种是重构HTML，使子菜单位于父级：

<ul id="parent">
    <li>menu item
        <ul id="submenu">
            <li>menu item</li>
        </ul>
    </li>
</ul>

或在JavaScript中检测/保存悬停的项目状态。要做到这一点，一种可能的方法是保存使用jQuery数据对象或将类（例如“on”）添加到您悬停的菜单上，并使用兄弟/子选择器来检测您是否在子菜单中。如果您不在父级或子菜单中，请删除“on”类。

有许多方法可以做到这一点，包括JavaScript / HTML / CSS和使用Drupal模块。如果您仍然感到困惑，请显示一些代码。