在Javascript中复制下拉菜单行为

时间:2011-07-15 21:12:44

标签: javascript jquery jquery-ui macos menu

我注意到OS X中下拉菜单的一个原因是它们处理转换到子菜单的方式。当您打开菜单并且想要从中打开子菜单时,只要指针位于从菜单侧面延伸的某个锥形区域内,子菜单就会保持打开状态。如果鼠标离开此区域,则菜单将立即关闭,但当鼠标位于该锥形区域时,菜单将从不关闭。这也允许您沿对角线路径移动鼠标以到达子菜单中的元素。

另一方面,除非您小心地沿着一系列直线路径移动鼠标以到达子菜单项,否则大多数网站上的子菜单都将关闭。在设计得更好的网站上(谷歌文档就像其他网站一样),菜单关闭之前会有一段延迟,它会解决整个对角路径问题,但会使界面看起来没有响应。

有没有办法在Web菜单中复制OS X行为?我并不熟悉一些更深奥的技巧。我正在考虑手动添加锥形区域(作为透明图像或其他内容)并在该区域上使用mouseinmouseout来处理显示和隐藏菜单。我不太确定如何去做。

1 个答案:

答案 0 :(得分:1)

如果我理解你的问题......请检查:

DEMO MENU

这有用吗?