在移动设备上实现:hover效果的行为

Question

7

在重新设计网站的过程中，我正在开发移动导航菜单时发现一些移动浏览器会通过轻敲来触发CSS :hover事件，包括Chrome、FlashFox以及Android 4.x上的默认浏览器，还有iOS 7上的Safari。这种行为是否普遍到足以依赖？我假设在Android 2.x手机上可能会出现问题。

我想知道是否有人有这方面的经验，这种行为是否可以安全地用于我的导航菜单。此外，是否有任何规范定义了这种行为，或者它只是突然出现的？从我看到的情况来看，它似乎在各种设备上表现得相当一致。

我以前用JavaScript做过移动导航菜单，但这是一个不错的选择。

我知道stackoverflow上有几个涉及这个主题的问题，但它们都很旧，我找不到任何关于我想知道的内容的问题。

编辑：为了澄清，该网站正在使用响应式设计，并且我不仅仅是尝试使用桌面风格的导航栏和:hover。该菜单已经格式化为移动设备，:hover将替换编写JavaScript以在轻敲菜单选项时显示子菜单的需要。

- Greg Rozmarynowycz

1

哦，是的，当我使用移动设备浏览时，:hover事件让我抓狂，尤其是当菜单在悬停时打开... - ConcurrentHashMap

可能是Does css hover work on mobile devices?的重复问题。 - Audrius Meškauskas

那个问题已经很老了，几乎与我观察和询问的行为完全无关；当时回答/提问时，Android 2还是全新的。 - Greg Rozmarynowycz

我经常使用它，而且它运行良好，所以我依赖它，但为了万无一失，暂时留一个JS备用方案。 - Devin

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- worldofjr · Accepted Answer

有些人说要使用 :hover，另一些人则建议使用 :active。我认为应该两者都使用（在同一个规则中），这样设备会根据支持的功能使用其中一个或两个。

我发现这种方法总是奏效。

希望这能有所帮助。