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. fullpage.js的easing参数怎样配置自定义动画

    首先看非官方文档 并没有详细的说明怎样去使用easing.js,所以我加的运动属性根本就不起作用, 再看,官方文档 Optionally, when using css3:false, you can ...

  2. linux之cut命令简单用法

    语法 cut [-bn] [file] cut [-c] [file] cut [-df] [file] 使用说明: cut 命令从文件的每一行剪切字节.字符和字段并将这些字节.字符和字段写至标准输出 ...

  3. sed的替换命令

    例1: [root@nhserver2 ~]# cat nagios.txt<TD ALIGN=LEFT valign=center CLASS='statusBGCRITICAL'>&l ...

  4. Git分支高级管理[四]

    标签(linux): git 笔者Q:972581034 交流群:605799367.有任何疑问可与笔者或加群交流 切换分支 git checkout 撤销对文件的修改 git checkout -- ...

  5. 2018-01-05-医药行业的IT革命探讨

    layout: post title: 2018-01-05-医药行业的IT革命探讨 key: 20180105 tags: IT AI 医疗 modify_date: 2018-01-05 --- ...

  6. CSS——元素分类

    1.标签元素被分为三大类:块状元素.内联元素和内联块元素. (1)常见块状元素有:<div>.<p>.<h1>...<h6>.<ol>.&l ...

  7. 03_Linux文件和目录

    一.Linux目录结构 /:根目录,一般根目录下只存放目录,在Linux下有且只有一个根目录.所有的东西都是从这里开始.当你在终端里输入"/home",你其实是在告诉电脑,先从/( ...

  8. 浅谈对SpringMVC的认识

    SpringMVC概念:     他是一个轻量级的开源框架,应用于表现层,基于MVC的设计模式. SpringMVC的特点:     1.他是单例的可以设置成多例.     2.他的线程是安全的    ...

  9. 闭包(流畅的python 学习笔记)

    什么是闭包 其实,闭包指延伸了作用域的函数,其中包含函数定义体中引用.但是不在定义体中定义的非全局变量.函数是不是匿名的没有关系,关键是它能访问定义体之外定义的非全局变量. 示例 7-8 averag ...

  10. 浅谈计算机中的IO模型

    IO模型一共有5种: blocking IO #阻塞IO nonblocking IO #非阻塞IO IO myltiplexing #IO多路复用 signal driven IO #信号驱动IO ...