jQuery 垂直悬停手风琴
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/712763/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery vertical hover accordion
提问by Shalan
What jQuery plugins exist for a vertical hover accordion? I am looking for a plugin to be used for a menu where:
垂直悬停手风琴有哪些 jQuery 插件？我正在寻找一个用于菜单的插件，其中：
- sub-menu items will only expand after a second being hovered over (so something that perhaps uses the hoverIntent plugin);
- it can degrade gracefully if Javascript is turned off; and
- will collapse/close any sub-menu item when the mouse moves completely off it.
- 子菜单项只会在悬停一秒后展开（因此可能使用了 hoverIntent 插件）；
- 如果关闭 Javascript，它可以优雅地降级；和
- 当鼠标完全离开它时，将折叠/关闭任何子菜单项。
thank u very much!
十分感谢！
采纳答案by eKek0
You can try jquery UI accordion. It has a lot of options and you can customize it, too.
您可以尝试jquery UI 手风琴。它有很多选项，您也可以自定义它。
回答by eKek0
I could be wrong, but I think there may be inherent problems with using a mouseover or mouseenter event to control a vertical accordion -- unless you reallyknow what the submenus are going to be like.
我可能是错的，但我认为使用 mouseover 或 mouseenter 事件来控制垂直手风琴可能存在固有的问题——除非你真的知道子菜单会是什么样子。
The problem lies in the what-if: you have a long list of items in a submenu, and some short submenus or single menu items that follow below. like this:
问题在于假设：子菜单中有很长的项目列表，下面还有一些简短的子菜单或单个菜单项。像这样：
- menu
- 1
- 2
- a
- b
- c
- d
- e
- f
- 3
- 4
- 5
- a
- b
- c
- 菜单
- 1
- 2
- 一种
- 乙
- C
- d
- 电子
- F
- 3
- 4
- 5
- 一种
- 乙
- C
So when you move from #2 to #3, #2 collapses, putting your pointer way down the list. You fire all the mouseover/out or mouseenter/leave events for #3, #4, #5... and maybe move past the whole menu... things can start bouncing around like crazy.
因此，当您从#2 移动到#3 时，#2 会折叠起来，将您的指针放在列表的下方。您为 #3、#4、#5 触发所有 mouseover/out 或 mouseenter/leave 事件……并且可能会移过整个菜单……事情会开始像疯了一样跳来跳去。
Maybe the hoverIntent plugin can be made to work, but I think just using the mouse click is a more elegant solution. At least for an abstracted list, that is.
也许可以使 hoverIntent 插件工作，但我认为只使用鼠标点击是一个更优雅的解决方案。至少对于一个抽象列表，就是这样。
回答by GeoAvila
hey take a look to this plugin for Hover Accordion, i was looking for the same effect and I found this. http://berndmatzner.de/jquery/hoveraccordion/
嘿，看看这个悬停手风琴插件，我正在寻找相同的效果，我找到了这个。http://berndmatzner.de/jquery/hoveraccordion/
And this may help to you to make hover with de original accordion of jquery.
$("#accordion").accordion({
event: "mouseover"
});
这可能有助于您使用 jquery 的原始手风琴进行悬停。
$("#accordion").accordion({
event: "mouseover"
});
