今天遇到手机端的css中a标签的active不起作用，原本想循环a标签，给当前的a标签添加class来解决，可觉得有点儿小麻烦，经查资料了解到解决此问题，只需要添加一个touchstart的空事件即可。

例子如下：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{ margin:0; padding:0; }
.domain a{ display:inline-block; border:1px solid #ccc; padding:5px 10px; margin:10px; }
.domain a:active{ background-color:#c00; color:#fff; }
</style>
</head>
<body>
<div class="domain" id="js-domain">
<a href="#">点击1</a>
<a href="#">点击2</a>
</div>

<script>
window.onload = function(){
var doma=document.getElementById("js-domain").getElementsByTagName('a');
for(var i=0;i<doma.length;i++){
doma[i].addEventListener('touchstart',function(){},false);
};
}
</script>

</body>
</html>

手机端css实现active伪类的更多相关文章

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

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

  2. css :active伪类的理解

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

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

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

  4. CSS Pseudo-classes（伪类）

    CSS Pseudo-classes(伪类) CSS伪类是用来添加一些选择器的特殊效果. 一.语法 伪类的语法: selector:pseudo-class {property:value;} CSS ...

  5. CSS属性、伪类选择器，CSS3选择器

    CSS1时IE6是部分支持,伟大的IE6!CSS2时IE6部分支持,伟大的IE6依旧是部分支持!CCS3盛行CSS4也已经提上日程的现在,IE6完全不支持.IE6你该走了,我们会永远记住你的功绩的!I ...

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

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

  7. css中的伪类

    伪类用于向某些选择器添加一些特殊效果. 1):focus 伪类在元素获得焦点的时向元素添加特殊样式.一般用于输入文本域,按钮,以及超链接. a:focus{color:red;}超链接字体为红色 in ...

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

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

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

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

随机推荐

  1. Leetcode之广度优先搜索（BFS）专题-994. 腐烂的橘子（Rotting Oranges）

    Leetcode之广度优先搜索(BFS)专题-994. 腐烂的橘子(Rotting Oranges) BFS入门详解:Leetcode之广度优先搜索(BFS)专题-429. N叉树的层序遍历(N-ar ...

  2. 递归拷贝目录与删除目录 WindowsAPI C++

    /*判断一个路径是否是已存在的目录*/ bool IsDirectory(const std::wstring& pstrPath) { DWORD dw = GetFileAttribute ...

  3. 布隆过滤器（Bloom Filter）原理以及应用

    应用场景 主要是解决大规模数据下不需要精确过滤的场景,如检查垃圾邮件地址,爬虫URL地址去重,解决缓存穿透问题等. 布隆过滤器(Bloom Filter)是1970年由布隆提出的.它实际上是一个很长的 ...

  4. [转帖]一张图让你看懂InnoDB

    一张图让你看懂InnoDB 2018年05月10日 10:02:34 灵魂自由的忙人 阅读数 299 https://blog.csdn.net/xiaoyi23000/article/details ...

  5. 自己总结的keepalived的配置流程以及注意事项

    编写背景:上班时领导要求我们团队实现postgresql主备切换的高可用问题,我辅助keepalived的部分,从查资料到实施最后使用,最后编写了这个博客,水平有限,欢迎大家指正 ###postgre ...

  6. 如何在java中去除中文文本的停用词

    1.  整体思路 第一步:先将中文文本进行分词,这里使用的HanLP-汉语言处理包进行中文文本分词. 第二步:使用停用词表,去除分好的词中的停用词. 2.  中文文本分词环境配置 使用的HanLP-汉 ...

  7. 【有奖征集】报表模板库邀您提反馈，轻松赢取P30！

    >>立即参赛 赛事初衷 大数据时代,数据的价值愈发彰显,什么样的报表才能真正帮助业务决策?这几乎是所有信息化建设的企业和个人都在思考的问题. 作为报表领域标杆企业,葡萄城于2017年推出了 ...

  8. SQL SERVER 字符串函数 STUFF()

    说明: STUFF 函数将字符串插入到另一个字符串中. 它从第一个字符串的开始位置删除指定长度的字符:然后将第二个字符串插入到第一个字符串的开始位置. 语法: STUFF ( character_ex ...

  9. vue组件添加事件@click.native

    1,给vue组件绑定事件时候,必须加上native ,否则会认为监听的是来自Item组件自定义的事件 2,等同于在子组件中:  子组件内部处理click事件然后向外发送click事件:$emit(&q ...

  10. C++学习 之 类的继承中的虚函数（笔记）

    1.多态行为 多态是面向对象语言的一种特征,让我们能够以类似的方式处理不同类型的对象.在C++中我们可以通过继承层次结构实现子类型多态. 我们可以通过下面的代码进一步了解多态: #include< ...