如何处理pc和移动的hover? 移动pc端指的是什么意思啊

说到移动和PC端中的hover处理问题，前端工作者肯定碰到过很多次了，如果没去仔细的研究过，就会忽略过去了。众所周知，现在项目都注重交互用户体验，譬如按钮之类的都加上hover效果。但是这个效果在PC端体验很好，如果页面需要做成响应式，那问题就来了，发现在移动端点击按钮后，会执行PC的hover效果，然后再跳转，返回的时候还是保持了hover效果。

我们要的效果就是在PC和移动端都保持一样的效果。于是我想到了:actived选择器，发现在不同手机浏览器上效果不一样，有的有效果，有得却没，烦躁ing…..

后来有一天无意中在美团上团购2张电影票，发现他们的处理方式很好。如果回去打开网站研究了一番，处理方法让我大吃一惊，一句代码搞定：

document.body.addEventListener(‘touchstart’, function(){ });

太神奇了，其实这句代码也没干什么，只有在BODY上绑定了一个touchstart事件。在性能上没什么影响，可以采取。希望能帮到正在为此问题发愁的你，如你有好的方法也可以留言给我。

在这里也想补充一下：在移动端中浏览器会有自带的一个点击高亮效果，可以通过给a标签或者body,html加如下代码：

-webkit-tap-highlight-color:transparent;

切图网（qietu.com）是一家专门从事web前端开发的公司，专注we前端开发，关注用户体验，欢迎订阅微信公众号：qietuwang