一、前提:
一个列表的切换按钮,在鼠标浮上的时候有二态显示,点击按钮直到列表的尽头时,按钮会被禁止点击,但是这个时候鼠标浮上还会有二态显示,怎么办呢?这个时候我需要在鼠标浮上的时候:hover不起作用
二、解决办法:pointer-events
在这个按钮被禁止的时候设置pointer-events:none
pointer-events取值:
对于浏览器来说,只有auto和none两个值可用,其它的几个是针对SVG的(本身这个属性就来自于SVG)。
pointer-events作用(值为none时):
- 阻止用户的点击动作产生任何效果
- 阻止缺省鼠标指针的显示
- 阻止CSS里的 hover 和 active 状态的变化触发事件
- 阻止JavaScript点击动作触发的事件
注:还有一个场景可以使用pointer-events:none,当使用canvas绘制出来的图不想让用户另存为的时候就给canvas设置这个属性