jquery - 将 CSS 垂直菜单转换为下拉菜单 - 一旦掉落就无法消失

Question

我有一个垂直的 CSS 菜单，我想将其转换为下拉菜单。我为鼠标悬停添加了一些 javascript 以使其下拉但无法让它在鼠标移开时消失。

http://jsfiddle.net/hCVjK/4/

Answer 1

这是一个很难解决的问题，尤其是当您正在淡出而不是立即隐藏时。您需要跟踪鼠标悬停在什么地方，并考虑到 mouseenter 和 mouseleave 事件不会在您从一个标记移动到另一个标记的同时完美触发这一事实。

试试这个: http://jsfiddle.net/cgagliardi/NPVVQ/

在 HTML 中，我删除了您在类别上的 onMouseOver 代码并将其移动到 JS 中。

在CSS中，我改变了

#navigation { ... visibility: hidden }

到

#navigation { ... display: none }

除此之外，所有更改都在 javascript 中。如果您想延迟主菜单淡出所需的时间，请更改 setTimeout 调用中的 100 值。