黑松山资源网 Design By www.paidiu.com
做移动前端也有一些日子了,一直有个问题没有解决,就是与pc端那样的一个:hover的效果,:hover是鼠标指针浮动在其上的元素的一个选择器,但因为在移动端是没有鼠标的,代替的是触摸屏,用户也不是有“鼠标指针浮动在其上的元素”的情况,有也很少。 所以取代的应该:active这个选择器,但是通过实践,发现情况不是很理想,在QQ浏览器上有时触发,有没不触发,在我mx3带自浏览器上根本没效果。
最近在看美团h5的页面时发现他们做对这个效果做得很好(这里说实话,美团网在h5这一块做得真好),看了他们代码之后,发现他们也是用:active来实现这个效果,但他们多了一行js代码,
复制代码代码如下:
document.body.addEventListener('touchstart', function () { });
其实这行代码带没有做什么事,只是对body绑定了一个touchstart事件,然后也没做什么事。
自已实践了一下发现可以了,效果真心不错。赞一下美团。
ps:在移动端中浏览器会有自带的一个点击高亮效果,可以通过给a标签或者body,html加
复制代码代码如下:
-webkit-tap-highlight-color:transparent;
都行。
最近在看美团h5的页面时发现他们做对这个效果做得很好(这里说实话,美团网在h5这一块做得真好),看了他们代码之后,发现他们也是用:active来实现这个效果,但他们多了一行js代码,
复制代码代码如下:
document.body.addEventListener('touchstart', function () { });
其实这行代码带没有做什么事,只是对body绑定了一个touchstart事件,然后也没做什么事。
自已实践了一下发现可以了,效果真心不错。赞一下美团。
ps:在移动端中浏览器会有自带的一个点击高亮效果,可以通过给a标签或者body,html加
复制代码代码如下:
-webkit-tap-highlight-color:transparent;
都行。
黑松山资源网 Design By www.paidiu.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
黑松山资源网 Design By www.paidiu.com
暂无评论...
更新日志
2024年11月15日
2024年11月15日
- 张真.1993-失恋十四行【上华】【WAV+CUE】
- 钟明秋《爱有天意HQCD》[低速原抓WAV+CUE]
- 孙云岗唢呐《金声玉振[HIFI珍藏版]》[低速原抓WAV+CUE]
- 谭艳精讯TEST-CD试音39号》2CD[DTS-WAV]
- 姚璎格《发烧女中音》DSD版[低速原抓WAV+CUE][1G]
- 张玮伽《微风细雨DSD》发烧大碟[WAV+CUE][1.1G]
- 群星《2024好听新歌14》十倍音质 U盘音乐 [WAV分轨][966M]
- s14全球总决赛T1战队队员都有谁 LOLs14全球总决赛T1战队介绍
- 英雄联盟faker身价有10亿吗 英雄联盟faker身价介绍一览
- faker大魔王称号怎么来的 faker大魔王称号来源介绍
- PS5 Pro上的蒂法更美了!博主盛赞新机1000%值得购买
- 腾讯互娱再离职一员大将!或因供应商贪腐
- Ayaneo3游戏掌机预热:旗舰定位、造型圆润自带底键
- 动力火车.1999-背叛情歌【上华】【WAV+CUE】
- 刘力扬.2019-Neon.Lit虹【摩登天空】【FLAC分轨】