IOS手机伪类a:active失效：点击更改颜色，松开恢复

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

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

IOS手机伪类a:active失效的更多相关文章

  1. CSS伪类选择器active模拟JavaScript点击事件

    一.说明 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式. IE7及更早浏览器只支持a元素的:active,从IE8开始支持其它元素的:active. 另:如果需要给超链接定义:访问前 ...

  2. react中IOS手机里面两个input同时存在时，聚焦focus失效解决办法

    最近在做webapp搜索功能时,用到两个input同时存在时,轻点input聚焦时,ios手机软键盘弹起又失效,一直在寻找合理的解决办法,现在最简单的总结回顾: <一>bug显示 < ...

  3. 关于伪类“:pseudo-class”和伪元素“::pseudo-element”的常见应用

    伪类用于指定要选择的元素的特殊状态,向其添加特殊的效果,比如: input { width: 515px; height: 50px; padding: 10px 20px; border: 1px ...

  4. CSS的伪元素和伪类

    css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类—— :hover, :active, :visited, :focus. 常见伪元素——::first-letter,::first-l ...

  5. IOS 伪类:active失效

    IOS中不兼容:active伪类,所以在状态控制上就会有问题,解决办法是,添加一个空的点击事件: 移动端添加:ontouchstart <a class="m-btn" on ...

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

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

  7. 获得touch事件,jquery绑定事件监听器,ios设备上打开touch状态以响应focus,active等伪类

    2. 默认的监听方式 document.addEventListener('touchstart', function(){ alert('hello'); }, false); 使用jquery时 ...

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

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

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

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

随机推荐

  1. Go 指针声明后赋值，出现 panic: runtime error: invalid memory address or nil pointer dereference

    指针基础知识package main import "fmt" func main() { var p *int p = new(int) *p = 1 fmt.Println(p ...

  2. Python学习笔记—Dict和set

    dict Python内置了字典:dict的支持,dict全称dictionary,在其他语言中也称为map,使用键-值(key-value)存储,具有极快的查找速度. 举个例子,假设要根据同学的名字 ...

  3. Python 安装 for Linux

    make后报错: Failed to build these modules:_multiprocessing   binascii           zlib 下载http://www.zlib. ...

  4. Bloomber 新建基金账户步骤

    --Bloomber 新建基金账户步骤0.执行FIRM命令1.新建account group2.新建account3.将account加入到account group4.将account group授 ...

  5. ORACLE 11G使用用EXPDP导出时，空表不能导出

    11G中有个新特性,当表无数据时,不分配segment,以节省空间解决方法:1.insert一行,再rollback就产生segment了.该方法是在在空表中插入数据,再删除,则产生segment.导 ...

  6. charles工具页面介绍

    charles的主页面介绍 手机连上代理之后,每在手机上进行操作我们便会在charles上接收到请求.此时的charles页面将会变成如下密密麻麻的内容,故这节课我们来讲解一下Charles的主页面 ...

  7. 重学Python - Day 07 - python基础 -> linux命令行学习 -- 常用命令 一

    常用命令和使用方法如下: man man 命令 #可以查询命令的用法 cat 和 tac cat是正序显示文件内容 tac是倒叙显示文件内容 sort 对文件内容排序 uniq 忽略文件中重复行 hi ...

  8. Java入门第一季学习总结

    一.课程总概 这门课程的学习难度属于入门级别,又由于有c++的基础,所以学习这门课程也是比较轻松的.可以简单地把这门课的学习分为四部分:第一部分,java的介绍(第一章):第二部分,java的数据类型 ...

  9. Web Components的概念和用法

    参考链接:https://developer.mozilla.org/zh-CN/docs/Web/Web_Components

  10. java8 stream多字段排序

    注:转载请注明出处!!!!!!! 很多情况下sql不好解决的多表查询,临时表分组,排序,尽量用java8新特性stream进行处理 使用java8新特性,下面先来点基础的 List<类> ...