请选择 进入手机版 | 继续访问电脑版
欢迎来到爱昵论坛!

爱昵论坛将免费提供最新资源学习交流、常见的解决方案社区平台

 找回密码
 立即注册

QQ登录

只需一步,快速开始

热搜: PS HTML+CSS JS
搜索
查看: 418|回复: 0

关于移动端IOS苹果手机:active设置无效vue如何解决等问题

[复制链接]

634

主题

687

帖子

2731

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
2731
发表于 2019-3-21 14:42:43 | 显示全部楼层 |阅读模式
前提
今天早上群里有人提问:iphone 不兼容CSS的:active怎么破?
我也是第一次听说这个问题,为了找到解决方法,于是去百度搜了一下。
原因
其实就是:苹果手机浏览页面中设置的css伪类:active失效了。

解决方法
在iOS系统的移动设备中,需要在按钮元素或body/html上绑定一个touchstart事件才能激活:active状态。
要让css的:active伪类生效,只需要给这个元素的touchstart/touchend绑定一个空的匿名方法即可成功。
Use the :active pseudo-class in your css, then add and to the body tag.(在您的css中使用:active伪类,然后添加ontouchstart=“”和onmouseover=“”到body标签。
  1. //非常简单
  2. <body ontouchstart=" onmouseover="">
  3. </body>
复制代码
问题来了:vue该怎么绑?
答:使用v-on指令。即v-on:touchstart=""(如下图所示)






回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|爱昵图库(Inpic) ( 鄂ICP备14000185号-1

GMT+8, 2019-10-19 20:01 , Processed in 0.109373 second(s), 35 queries .

Powered by Inpic

© 2013-2016 Inpic.com.cn

快速回复 返回顶部 返回列表