今天遇见一个问题。
在鼠标放上 图片上的时候。
删除图标一直不停的闪烁。 我当时觉得很奇怪,父子关系的结构
不应该闪烁呀。
看了下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肯定是可以的

css hover频繁闪烁的更多相关文章

  1. 【笔记】css hover 伪类控制其他元素

    最近在模仿一个网站的项目 当中有一个效果需要利用到hover效果因为不太想写jq脚本所以百度了一下css hover的运用发现原来hover也可以控制其他元素的变化的 但是这有一个要求 就是添加hov ...

  2. CSS active选择器与CSS hover选择器

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  3. CSS hover

    CSS hover hover 鼠标移动到当前标签上时,以下css属性才能生效 <!DOCTYPE html> <html lang="en"> <h ...

  4. 10个CSS+HOVER 的创意按钮

    CSS hover 样式很简单,但是想创造出有意思.实用.有创意性的特效是很考验设计师的创意能力,所以设计达人每隔一段时间都会分享一些与鼠标点击.悬停的相关特效,以便大家获得更好的创造灵感. 今天我们 ...

  5. css hover伪类选择器与JQuery hover()方法

    css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...

  6. css:hover状态改变另一个元素样式的使用

    效果演示 css:hover状态改变另一个元素样式的使用 .box { width: 150px; height: 150px; background-color: #069; line-height ...

  7. css hover 动画 transition:background-color 0.2s,color 0.2s; 外层套内层,正常是 里外层 鼠标上来 外层有hover,如果就想到里层hover触发外层hover,要用外层position 定义绝对定位,内层的hover跳出外层的div,这样视觉上就是两个单独的div,进行内外层联动。

    css hover 动画 transition:background-color 0.2s,color 0.2s; 外层套内层,正常是 里外层 鼠标上来 外层有hover,如果就想到里层hover触发 ...

  8. CSS hover box

    CSS hover box transition 踩坑指南, display: none; 作为初始状态,不会产生动画效果,必须设置 height: 0; 或 width: 0; 来实现隐藏! tra ...

  9. css样式hover图片闪烁问题

    主要是ie8及ie8以下版本浏览器会出现此问题, 问题核心是因为hover选择器没有缓存即将要替换的图片, 所以导致替换期间有一个极其短暂的空白期. 解决方案: 采用 background-posit ...

  10. css hover对其包含的元素进行样式设置

    <ul class="icon-down-single-arr-li"> <li> <a href="javascript:void(0)& ...

随机推荐

  1. Neo4j Neo.TransientError.General.MemoryPoolOutOfMemoryError

    The allocation of an extra 4.0 MiB would use more than the limit 2.0 GiB. Currently using 2.0 GiB. d ...

  2. PPT 图片框架排版万能能公式

    图片作用 提升设计感 辅助表达 传递情感 如何选择一张高大上的图片? 星空.地球.城市.海洋.线条.粒子.山脉.壁纸(系统.手机厂商千挑万选的) https://cn.bing.com/images ...

  3. FTP 被动模式配置

    总结:FTP 21端口,可以主动连接,防火墙配置一下21端口放行就OK了.非21端口,需要设成被动连接和端口范围.防火墙要做相应的配置 原理 https://www.cnblogs.com/zjoch ...

  4. ajax补充说明 多对多三种创建方式 django内置序列化组件 ORM批量操作数据 分页器 form组件入门

    目录 ajax补充说明 request.is_ajax() ajax回调函数接收返回值 ajax回调函数 接受json数据 第一种方式:后端使用json模块 第二种方式:后端返回JsonRespons ...

  5. JSP 简单入门与 IDEA 开发环境配置

    原作者为 RioTian@cnblogs, 本作品采用 CC 4.0 BY 进行许可,转载请注明出处. 在学 Java 连接数据库时老师提到过 JSP,刚好这个学期有 JSP 的课程,现做一些基础以及 ...

  6. modint 板子

    自动对 int 取模 // modint template<int MOD> struct Fp { ll val; constexpr Fp(ll v = 0) noexcept : v ...

  7. django动态创建表和动态选择实体

    开发有时需要动态创建表,创建完成后需要动态选择model对应的表,该需求如何实现 1.model层   TestBlock为了动态创建表.getBlockModel为了动态选择表 from djang ...

  8. 【VSCode】秒下vscode

    有时从vscode官网下载速度奇慢甚至失败,介绍一种方法可以秒下 进入官网选择要下载的版本 像我的电脑,下载网址根本打不开 修改下载网址,替换下载地址中红框字符串:vscode.cdn.azure.c ...

  9. JS - this 操作 dom , 添加样式

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  10. Razor 语法@Html.DropDownList,根据List集合或者枚举生成Select标签

    1.根据List集合生成Select标签,根据数据库数据换成SelectListItem集合 Action 方法(也可使用下方的List集合的扩展方法): 1 var selectList = DBL ...