onmouseover事件闪烁问题

问题描述

onmouseover时需要显示一个层,onmouseout时隐藏这个层。当鼠标移入的时候显示层不断闪烁。

问题原因

显示层遮住了添加事件的元素,所以反复执行onmouseover onmouseout。

解决办法

给显示层添加样式:

  pointer-events: none;

mdn上关于这个属性的解释是:

pointer-events CSS属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target

意思就是添加了这个属性的元素在什么情况下可以成为鼠标事件的target

除了指示该元素不是鼠标事件的目标之外,值none表示鼠标事件“穿透”该元素并且指定该元素“下面”的任何东西。

当元素的pointer-events属性取值为none的时候,表示该元素不是鼠标事件的目标元素,并且鼠标事件穿透该元素指定它下面的元素。


原文地址:https://blog.csdn.net/sansan_7957/article/details/81873928

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,720评论 1 11
  • 本篇博客源地址 总结: 鼠标事件 1.click与dbclick事件ele.click()ele.click(ha...
    ZombieBrandg阅读 758评论 0 1
  • 总结: 鼠标事件 1.click与dbclick事件$ele.click()$ele.click(handler(...
    阿r阿r阅读 1,726评论 2 10
  • (续jQuery基础(1)) 第5章 DOM节点的复制与替换 (1)DOM拷贝clone() 克隆节点是DOM的常...
    凛0_0阅读 1,531评论 0 8
  • 第1章 鼠标事件 1-1 jQuery鼠标事件之click与dbclick事件 用交互操作中,最简单直接的操作就是...
    mo默22阅读 1,352评论 0 6

友情链接更多精彩内容