pointer-events:none;

简介:
http://www.zhangxinxu.com/wordpress/2011/12/css3-pointer-events-none-javascript/

pointer-events:  auto | none
  • auto——效果和没有定义pointer-events属性相同,鼠标不会穿透当前层。在SVG中,该值和visiblePainted的效果相同。

  • none——元素不再是鼠标事件的目标,鼠标不再监听当前层而去监听下面的层中的元素。但是如果它的子元素设置了pointer-events为其它值,比如auto,鼠标还是会监听这个子元素的。

  • 其它属性值为SVG专用,这里不再多介绍了。


浏览器兼容性

Firefox 3.6+和chrome 2.0+ 以及safari 4.0+都支持这个CSS3属性,IE6/7/8/9都不支持,Opera在SVG中支持该属性但是HTML中不支持。好吧,还是有点儿悲催~~


用途1:pointer-events:none;+无href 可做不可点状态

用途2:在定位层上加pointer-events:none;可穿透 定位层下面的内容可选可点



      本文转自Ansue  51CTO博客,原文链接:http://blog.51cto.com/ansue/1735382,如需转载请自行联系原作者


相关文章
|
3月前
|
API 计算机视觉
Using ‘value‘ pointer is unsafe and deprecated. Use NULL as value pointer. To fetch trackbar value s
本文讨论了OpenCV中使用`createTrackbar`时遇到的"Using ‘value’ pointer is unsafe and deprecated"警告,并提供了通过设置空指针或使用回调函数来解决这个问题的方法。
Using ‘value‘ pointer is unsafe and deprecated. Use NULL as value pointer. To fetch trackbar value s
|
4月前
|
Web App开发 JavaScript
vue报错【解决方案】 [Violation] Added non-passive event listener to a scroll-blocking <some> event.
vue报错【解决方案】 [Violation] Added non-passive event listener to a scroll-blocking <some> event.
400 0
有趣的 events_statements_current 表问题
有趣的 events_statements_current 表问题
153 0
|
C++
warning C4996 sprintf This function or variable may be unsafe
warning C4996 sprintf This function or variable may be unsafe
82 0
|
弹性计算 关系型数据库 数据库连接
PostgreSQL 12 preview - Move max_wal_senders out of max_connections for connection slot handling
标签 PostgreSQL , max_wal_senders , max_connections , sorry, too many clients already 背景 如果你需要使用PG的流复制,上游节点的max_wal_senders参数,用来限制这个节点同时最多可以有多少个wal sender进程。 包括逻辑复制、物理复制、pg_basebackup备份等,只要是使用stre
374 0
|
开发者
Dynamic function tracing events
本文翻译自LWN文章“Dynamic function tracing events”,原文[链接](https://lwn.net/Articles/747256/) 从内核引入tracepoint开始,开发者们就对这些tracepoint是否为内核ABI的一部分而发生过争执。过去由于破坏了已有存在依赖的用户态程序,tracepoint相关变更被回退过。同时,对内部代码无法改变的恐慌使得在
1145 0
|
网络协议 CDN