css hover频繁闪烁

简介: css hover频繁闪烁

今天遇见一个问题。


在鼠标放上 图片上的时候。


删除图标一直不停的闪烁。


我当时觉得很奇怪,父子关系的结构


不应该闪烁呀。


看了下html和css,发现子元素(要hover)的元素是绝对定位了的


于是我就给


子元素添加了一css样似


pointer-events: none;


于是就解决了闪烁问题。


后来我去看了一下,


pointer-events: none;


很多人这样解释


如果为某个元素样式设置了“pointer-events: none ”,


这个元素的 事件、连接、悬浮样式都没有了


(1)点击a标签,不会跳转到链接地址


(2)而且也没有悬浮样式


(3)注册的事件没有任何效果


如果为div设置了“pointer-events: none ”,


相当于div只是一个虚设的东西,如同海市蜃楼,任何事件都可以轻易从它身上穿过去


参考地址:https://www.cnblogs.com/xiaonangua/p/10734573.html


pointer-events 是CSS3的一个属性,支持的值非常多,其中大部分都是和SVG有关


pointer-events: none;


意思就是让鼠标事件失效(链接、点击等事件)


常用场合:获取验证码  在2s内点击某一个元素莫得反应


引用场景:在一段时间内,点击某一个元素莫得反应。


有些时候,当我hover一个元素莫得反应时,


你可以将将元素放到 下一级上:hover


或者是兄弟关系:hover


hover肯定是可以的


相关文章
|
2月前
|
前端开发 JavaScript
css之伪类hover改变自身、子元素、其他元素的样式
css之伪类hover改变自身、子元素、其他元素的样式
29 0
|
5月前
|
前端开发
CSS改变图标颜色(filter一行代码解决hover变换颜色问题)
CSS改变图标颜色(filter一行代码解决hover变换颜色问题)
59 0
|
5月前
|
XML 前端开发 小程序
css实例(一)鼠标hover下拉菜单
红框标注位置,有一个小尖尖角,这个使用样式是这样实现的。 css 复制代码
64 0
|
6月前
|
前端开发 JavaScript
CSS: hover选择器控制子元素的出现和隐藏
CSS: hover选择器控制子元素的出现和隐藏
49 0
|
7月前
css3 hover效果
css3 hover效果
27 0
|
10月前
|
前端开发
css中hover变大效果
css中hover变大效果
95 0
|
10月前
|
前端开发
CSS图片放大hover效果,过度效果
CSS图片放大hover效果,过度效果
105 0
|
10月前
|
前端开发
在CSS上覆盖图片hover,过度效果
在CSS上覆盖图片hover,过度效果
51 0
|
12月前
|
前端开发
CSS:实现 hover 时文字波浪式变色效果
CSS:实现 hover 时文字波浪式变色效果
|
前端开发
CSS八种让人眼前一亮的HOVER效果
CSS八种让人眼前一亮的HOVER效果
CSS八种让人眼前一亮的HOVER效果