移动端:active伪类无效的解决方法【移动端 :active样式无效】2016-09-26  15:46:50

问题: 移动端开发的时候实现按钮的点击样式变化,但是在iphone【safiri Mobiles】下没有效果显示!

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

代码:

  

 //移动端:active伪类无效的解决方法
document.body.addEventListener('touchstart', function () {});

  

  

移动端bug~~移动端:active伪类无效的解决方法【移动端 :active样式无效】的更多相关文章

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

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

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

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

  3. css :active伪类的理解

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

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

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

  5. Eclipse、MinGW、JNI编写C++生成dll, Java端调用的完整示例(附java.lang.UnsatisfiedLinkError解决方法)

     Eclipse.MinGW.JNI编写C++生成dll, Java端调用的完整示例(附java.lang.UnsatisfiedLinkError解决方法) 问题背景:之前的JNI编程都是基于And ...

  6. [转] 用javascript修改css伪类的几种方法

    用javascript修改css伪类的几种方法: Modify pseudo element styles with JavaScript http://pankajparashar.com/post ...

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

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

  8. 移动端遇到的常见JS与CSS问题及解决方法

    由于笔者的水平有限,虽说都是笔者遇到过使用过的,但文中可能也会出现一些问题或不严谨的地方,望各位指出,不胜感激! 一. css部分 body如果设置height:100%;overflow:hidde ...

  9. 移动端H5页面中1px边框的几种解决方法

    问题提出 这是一个比较老的问题了,我第一次注意到的时候,是UI设计师来找我麻烦,emmm那时候我才初入前端职场,啥也不懂啊啊啊啊啊,情形是这样的:设计师拿着手机过来:这些边框都粗了啊,我的设计稿上是1 ...

随机推荐

  1. LLBLGen Pro v4.2_Patch+Keygen

    将dll文件覆盖安装目录下的文件,之后用算号器算出license文件,将license文件放在安装目录下即可. 算号器是在http://www.dxper.net/thread-408-1-1.htm ...

  2. MVC教程相关

    本教程所有文章导航 本系列共10篇文章,翻译自Asp.Net MVC4 官方教程,由于本系列文章言简意赅,篇幅适中,从一个示例开始讲解,全文最终完成了一个管理影片的小系统,非常适合新手入门Asp.Ne ...

  3. Beagleboard xm sd卡恢复

    来源于:http://circuitco.com/support/index.php?title=BeagleBoard-xM windows下恢复更加简单,推荐windows系统下恢复. To in ...

  4. K近邻分类法

    K近邻法 K近邻法:假定存在已标记的训练数据集,分类时对新的实例根据其K个最近邻的训练实例的类别,通过多数表决等分类决策规则进行预测. k近邻不具有显示学习的过程,是“懒惰学习”(lazy learn ...

  5. IOS线程学习(一)

    1.NSThread  官方的描述 An NSThread object controls a thread of execution. Use this class when you want to ...

  6. Python基础知识之认识字符串

    Python有一个名为“STR”与许多方便的功能(有一个名为“串”,你不应该使用旧的模块),内置的字符串类. 字符串常量可以通过双或单引号括起来,尽管单引号更常用. 反斜杠工作单,双引号内的文字通常的 ...

  7. linux 下C语言学习路线

    UNIX/Linux下C语言的学习路线.一.工具篇“公欲善其事,必先利其器”.编程是一门实践性很强的工作,在你以后的学习或工作中,你将常常会与以下工具打交道, 下面列出学习C语言编程常常用到的软件和工 ...

  8. TransactionScope 使用记录

    最近使用TransactionScope来进行处理不同数据库的操作问题,当看到这里的时候肯都是在使用或者要使用的吧,关于他的使用网络上一大堆,我在使用的时候遇到了一下的问题,作为记录,可能会对以后使用 ...

  9. list排序

    今天要对List排序,上网查了很多方法都感觉比较麻烦,现在终于找到了两种比较简便的方式,在此写出来,防止忘记!同时供大家参考! using System; using System.Collectio ...

  10. firefox vimperator插件

    firefox vimperator插件实在是强大,最喜欢的几个功能做个笔记. 如何复制网页上的文字:c进入caret模式,定位cursor到要复制的开始位置--v进入visual模式,用hjkl键选 ...