架构师_程序员_码农网

 找回密码
 注册[Register]

QQ登录

只需一步,快速开始

查看: 8585|回复: 1

[CSS/DIV] css 样式:pointer-events: none

[复制链接]
发表于 2020-5-11 17:55:25 | 显示全部楼层 |阅读模式
pointer-events: none 顾名思义,就是鼠标事件拜拜的意思。元素应用了该 CSS 属性,链接啊,点击啊什么的都变成了 “浮云牌酱油”。pointer-events: none 的作用是让元素实体 “虚化”。例如一个应用 pointer-events: none 的按钮元素,则我们在页面上看到的这个按钮,只是一个虚幻的影子而已,您可以理解为海市蜃楼,幽灵的躯体。当我们用手触碰它的时候可以轻易地没有任何感觉地从中穿过去。
大家都知道 input[type=text|button|radio|checkbox] 支持 disabled 属性,可以实现事件的完全禁用。如果其他标签需要类似的禁用效果,可以试试 pointer-events: none

举个简单的例子:

这个链接,你是点不了的,并且 hover 也没有效果。(值得一提的是,仅仅是鼠标事件失效,用 tab 键还是可以选中该链接的,然后 enter 打开,这个时候可以去掉 a 标签的 href 属性,就不能让 tab 键选中了)

https://developer.mozilla.org/zh-CN/docs/Web/CSS/pointer-events

默认值为:








上一篇:求 筑龙 建筑电气安装施工技术从入门到精通
下一篇:angular encapsulation 的三种使用方式
码农网,只发表在实践过程中,遇到的技术难题,不误导他人。
 楼主| 发表于 2021-3-10 11:30:59 | 显示全部楼层
jQuery 代码

码农网,只发表在实践过程中,遇到的技术难题,不误导他人。
您需要登录后才可以回帖 登录 | 注册[Register]

本版积分规则

免责声明:
码农网所发布的一切软件、编程资料或者文章仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。如有侵权请邮件与我们联系处理。

Mail To:help@itsvse.com

QQ|手机版|小黑屋|架构师 ( 鲁ICP备14021824号-2 )|网站地图

GMT+8, 2024-4-24 01:42

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表