safari浏览器下hover失效的解决方法

　　　　如图，左上角的菜单，我是使用CSS的hover菜单实现的，但它在手机端的safari浏览器下失效，表现为：点击那三横线图标后，弹出了菜单，如果不点击菜单的话，弹出的菜单就不会再消失，点击空白处也无法消失。这样就无法达到效果，违背了平常的浏览习惯了。

　　还是有办法解决的：

第一方法:使用JS绑定：

1
document.body.addEventListener('touchstart',function(){});

第二种方法：HTML添加

1
<body ontouchstart>

　　这样就可以在safari浏览器下，点击图标，弹出菜单，点击空白处，即可关闭菜单，达到所要的效果。PC端是鼠标移动到图标上面，即弹出菜单，鼠标移开即消失。