用纯css就能实现取消事件响应的方法,pointer-events,使用起来更加简单,它可以:

pointer-events:  auto | none | visiblePainted | visibleFill | visibleStroke | visible | painted | fill | stroke | all | inherit 

1 阻止用户的点击动作产生任何效果

2 阻止缺省鼠标指针的显示

3 阻止CSS里的hover和active状态的变化触发事件

4 阻止JavaScript点击动作触发的事件

比如以下CSS就顺起到将禁用的按钮灰掉的效果

.disabled {
pointer-events: none;
cursor: default;
filter: alpha(opacity=50); /*IE滤镜,透明度50%*/
-moz-opacity: 0.5; /*Firefox私有,透明度50%*/
opacity: 0.5; /*其他,透明度50%*/
}

兼容性问题:

CSS3:pointer-events | a标签禁用的更多相关文章

  1. 浏览器 Pointer Events

    前言 Pointer Events是一套触控输入处理规格,支持Pointer Events的浏览器包括了IE和Firefox,最近Chrome也宣布即将支持该处理规则. PointerEvent Po ...

  2. a标签禁用

    a标签禁用可以使用CSS3的特性来控制 <a class="disabled">我是a标签</a> a.disabled { pointer-events: ...

  3. 12种炫酷HTML5 SVG和CSS3表单浮动标签特效

    这是一组效果非常炫酷的HTML5 SVG和CSS3表单浮动标签特效.这组浮动标签特效共12种效果,使用SVG和CSS3来制作完成.这些浮动标签效果部分在元素的伪元素上使用CSS transitions ...

  4. CSS3之尖角标签

    如图所示,Tag标签的制作通常使用背景图片,现在用CSS3代码就能实现尖角效果(需浏览器支持CSS3属性). 运用CSS3样式实现尖角标签,只需要写简单的HTML结构和CSS样式. <p> ...

  5. CSS3的几个标签速记3

    transition:CSS3过渡     css3里很好的一个标签,可以非常方便的完成需要很多JS才能完成的动态效果 例语法:transition:width 2S,height 2S,transf ...

  6. CSS3的几个标签速记1

    border-radius:CSS3圆角   语法:border-radius:25px;     椭圆边角:语法-border-radius:xx%;或者15px/100px; box-shadow ...

  7. 使用CSS3中的input标签与lable标签组合实现banner图的切换

    在做网页时,我们经常可以碰到banner图的切换.对于那些JS薄弱的同学来说,这就很尴尬了.今天,我来告诉大家如何使用CSS做出banner图切换的效果. 这里,用到了lable标签与input的组合 ...

  8. 用CSS3制作尖角标签按钮样式

    如图的效果.标签有背景色,且左侧有一个三角形,三角形中间有个白色的圆圈. 你一定在想这个效果是背景图切出来的吧——答案是没有用到任何图片 那你会不会在想这个效果的html结构很复杂呢——答案是最简单的 ...

  9. CSS3给页面打标签

    我们经常会在页面的左上角或者右上角看到类似如图所示的标签,比如页面的链接(最常使用)等,下面我们就实现一个简单的标签 实现步骤是先做一个水平长条,使用CSS3的transform来实现旋转,如果是在左 ...

随机推荐

  1. BZOJ 2957:楼房重建(分块)

    http://www.lydsy.com/JudgeOnline/problem.php?id=2957 题意:…… 思路:对于每一个块,维护一个单调递增的斜率(因为小于前面的斜率的话是肯定看不见的) ...

  2. Go - 循环

    目录 概述 循环 array 循环 slice 循环 map break continue goto switch 推荐阅读 概述 前几篇文章分享了 array 数组.slice 切片.map 集合, ...

  3. TPL DataFlow .Net 数据流组件,了解一下

    回顾上文 作为单体程序,依赖的第三方服务虽不多,但是2C的程序还是有不少内容可讲: 作为一个常规互联网系统,无外乎就是接受请求.处理请求,输出响应. 由于业务渐渐增长,数据处理的过程会越来越复杂和冗长 ...

  4. Java_Set用法总结

    在java语言中,提供多种不同的结构来组织对象,Set(集合)是其中的一种,本身是一个接口,其迭代时的顺序取决于其具体实现. 典型的实现包括: HashSet:哈希表是通过使用称为散列法的机制来存储信 ...

  5. android布局几点随想

    1. 正式布局界面时,先在纸上画出整个布局,并考虑用什么布局比较适合: 2. 布局界面先做出框架,并用不同的背景颜色标记出来,确保大的布局框架式正确的: 3. 接着在每个大的布局框架内布局小的布局: ...

  6. .Net微信网页开发之JSSDK使用步骤和配置信息timestamp(时间戳),nonceStr(随机串),signature(签名),access_token(接口调用凭据)的生成获取讲解

    前言: 因为接下来会有几篇关于微信JS-SDK功能使用的文章,主要会对微信分享,获取设备信息,获取地理位置,微信扫一扫这几个功能进行讲解.而这几个功能都是围绕着微信JS-SDK实现的,首先使用微信JS ...

  7. spring mvc 拦截器的使用

    Spring MVC 拦截器的使用 拦截器简介 Spring MVC 中的拦截器(Interceptor)类似于 Servler 中的过滤器(Filter).用于对处理器进行预处理和后处理.常用于日志 ...

  8. python基础知识四 小数据池,深浅拷贝,集合+菜中菜

    四.小数据池,深浅拷贝,集合+菜中菜 1小数据池 --缓存机制(驻留机制) ​ '==' 判断两边内容是否相等 ​ 'is' 基于内存地址进行判断是否相同 a = 10 b = 10 print(a ...

  9. 深度解密Go语言之channel

    目录 并发模型 并发与并行 什么是 CSP 什么是 channel channel 实现 CSP 为什么要 channel channel 实现原理 数据结构 创建 接收 发送 关闭 channel ...

  10. spring配置文件比较全的约束

    个人总结:Spring的配置文件applicationContext.xml约束文件.全面约束 <?xml version="1.0" encoding="utf- ...