mozilla开发社区上有 :active 不起作用的答案：

[1] By default, Safari Mobile does not use the :active state unless there is a touchstart event handler on the relevant element or on the <body>.

在iOS系统的移动设备中，需要在按钮元素或body/html上绑定一个touchstart事件才能激活:active状态。

document.body.addEventListener('touchstart', function () { //...空函数即可 });

将上述事件监听代码加上后，Safari Mobile上就可以看到按钮按下后的切换效果了。

解决ios不支持按钮:active伪类的方法的更多相关文章

  1. 解决scroll在ios上卡顿问题和兼容ios不支持:active伪类情况

    //有时候因为滚动层级元素过多会产生卡顿,特别在ios上十分明显,如果不想更换其他实现方式,可以加:-webkit-overflow-scrolling: touch; 开启硬件加速: 兼容ios不支 ...

  2. 移动端bug~~移动端:active伪类无效的解决方法【移动端 ：active样式无效】

    移动端:active伪类无效的解决方法[移动端 :active样式无效]2016-09-26  15:46:50 问题: 移动端开发的时候实现按钮的点击样式变化,但是在iphone[safiri Mo ...

  3. 移动端:active伪类无效的解决方法

    :active伪类常用于设定点击状态下或其他被激活状态下一个链接的样式.最常用于锚点<a href="#">这种情况,一般主流浏览器下也支持其他元素,如button等. ...

  4. iOS Web开发激活css的active伪类

    最近在做一个资讯客户端,用到UIWebview展示一些网页内容,本来想做一个简单的按压效果,发现在css中设置active属性一直不管用. 查阅了一下资料,今天发现,要让css active伪类生效, ...

  5. css :active伪类的理解

    /*active伪类为点击鼠标按下去还没松开鼠标的那一瞬间的事件*/

  6. 微信浏览器或各种移动浏览器上:active伪类做的触觉反馈失效

    在做移动端页面的时候,会发现PC上那种:hover的效果是不管用了的,但又要给用户一个点击反馈怎么办呢?我管它叫触觉反馈. 细心点就会发现浏览器有自带了一点触觉反馈,在点击a.button.input ...

  7. CSS3伪类使用方法实例

    有时候在网页设计中会涉及到很多看上去很繁琐的设计图,这时候都会很让人头疼,那么这时候伪类就可以来帮助你解决问题了. 下面有一段实例大家可以参考一下: <!DOCTYPE html> < ...

  8. H5解决active伪类失效---点击后背景效果

    <body ontouchstart></body> 给body注册一个空事件即可

  9. 解决ios safari中按钮圆角问题【原创】

       问题描述 使用html5编写页面在移动app中嵌套,总会涉及到按钮的使用,在android手机浏览器中显示正常,但在ios safari浏览器中会看到按钮显示为圆角样式,设置border-rad ...

随机推荐

  1. pat 1014 1017 排队类问题

    1.用循环模拟时间 2.采用结构体模拟客户和窗口对象 3.合理处理边界,去除无用信息 4.使用自带排序sort()结合自定义功能函数compare()实现排序

  2. final修饰符，多态，抽象类，接口

    1:final关键字(掌握)    (1)是最终的意思,可以修饰类,方法,变量.    (2)特点:        A:它修饰的类,不能被继承.        B:它修饰的方法,不能被重写.      ...

  3. 蓝桥杯练习系统—基础练习 sine之舞

    题目:最近FJ为他的奶牛们开设了数学分析课,FJ知道若要学好这门课,必须有一个好的三角函数,所以他准备和奶牛们做一个"Sine之舞"的游戏,寓教于乐,提高奶牛们的计算能力. 不妨设 ...

  4. 实现兼容document.querySelector的方法

    var querySelector = function(selector) { //TODO 先简单兼容,后续继续扩展: var element = null; if(document.queryS ...

  5. 多线程访问DataTable

    项目中需要读取数据库中的多张表.由于表的数据比较多,串行读取时耗时比较多,所以对程序做了一点优化. 环境 .NET 3.5,SQL Server 2012,Visual Studio 2015 过程 ...

  6. ipcs、ipcrm、sysresv、kernel.shmmax

    ipcs.ipcrm.sysresv.kernel.shmmax 1.1  BLOG文档结构图 1.2  前言部分 1.2.1  导读和注意事项 各位技术爱好者,看完本文后,你可以掌握如下的技能,也可 ...

  7. xBIM 格式之间转换

    目录 xBIM 应用与学习 (一) xBIM 应用与学习 (二) xBIM 基本的模型操作 xBIM 日志操作 XBIM 3D 墙壁案例 xBIM 格式之间转换 xBIM 使用Linq 来优化查询 x ...

  8. Nodejs的运行原理-函数回调篇

    前言 当客户端向http server 发起TCP链接时,server端会发起一系列的callback调用,这是一个逆向调用的过程:开始于libuv,终止于js代码里的callback(promise ...

  9. 模拟器配置使用Fildder进行抓包，包含Https+证书

    1.首先,百度检索.参考别人的,大致上都是到安装证书就失败了.我后面只说几个关键点. 2.安装证书,必须设置屏幕密码.我最开始使用把cef拷贝到,手机结果出现bug,安装不了.后来采用了在手机内部访问 ...

  10. Go基础之--排序和查找操作

    排序操作主要都在sort包中,导入就可以使用了import("sort") 常用的操作 sort.Ints:对整数进行排序sort.Strings:对字符串进行排序sort.Flo ...