Bootstrap悬停和单击事件冲突在一起使用时同时具有菜单的悬停和单击事件

Question

我第一次使用bootstrap 2.3版。到目前为止它还没有顺利，因为这是我第一次实现bootstrap响应式设计。

我有一个带子菜单的导航菜单，我被要求同时拥有click＆amp;这些菜单的hover功能使得当在桌面上查看网站时，它会悬停在视图子菜单上，并在移动设备上查看时使用Click事件。

在遇到一些问题后，我设法使其工作，以便我有两个事件都可以用于菜单导航，但是我遇到了一个问题，我仍然卡住了。

到目前为止演示的链接在这里：

http://demo.kashmirsouq.com/TestPage.htm

目前在移动设备上，我必须双击菜单并等待半秒才能打开子菜单。我无法弄清楚如何通过用户单击显示子菜单。

我一直在努力解决这个问题两天，所以我很感激这个问题的帮助。

参考：我使用以下主题：http://htmlstream.com/unify/但我修改了一些代码以使其具有悬停功能。

悬停事件基于此：https://github.com/CWSpear/twitter-bootstrap-hover-dropdown

我很感激这方面的帮助。

Answer 1

您实际上可以单独使用CSS来完成此操作，而不必担心为此渲染JS。利用菜单项上的:hover伪类，并在悬停时将显示块应用于选择器的相邻“菜单项”（当然，您也可以为动画添加css-transitions） - 请记住css非HTML5浏览器不支持转换）。

在第一次点击时，触摸设备上会激活:hover伪类，并在其他任何地方点击暂停悬停状态。请参阅以下文章，该文章转发相同的消息：http://www.html5rocks.com/en/mobile/touchandmouse/#toc-4

这是一个工作小提琴（http://jsfiddle.net/svigna/2eaNY/），展示了这种方法。