jquery - 在 iOS 设备上关闭 CSS 菜单

Question

我正在为关闭 iOS 上的 css 菜单而苦苦挣扎。菜单使用 :hover 显示，因此 div 设置为 block 状并显示在屏幕上。这在 iOS 上显示正常，因此显示菜单，但如果您单击菜单，只是进入空白区域，菜单仍然存在。似乎没有办法让它隐藏并删除 :hover 状态。

我发现，如果您在 iOS 设备上单击空白区域(不是链接或任何设置了 :hover 或 cursor:pointer 的 div)，那么似乎没有点击被注册，所以我猜这是主要问题。

我该如何解决这个问题？有什么办法可以让纯 css 菜单在 iOS 上正常工作吗？

问题的一个例子在选择海滩菜单上 http://www.beachstays.com.au/

谢谢

Answer 1

我已经使用 jQuery 模仿 css 悬停功能来解决类似问题。可能值得一试？

http://codepen.io/anon/pen/mEtGy

$('.tohover').mouseover( function(){
  $(this).addClass('hover');
});

$('.tohover').mouseout( function(){
  $(this).removeClass('hover');
});