CSS里的hover实现遮盖罩出现闪动的情况怎么办
Admin 2022-07-13 群英技术资讯 1717 次浏览
这篇文章主要讲解了“CSS里的hover实现遮盖罩出现闪动的情况怎么办”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS里的hover实现遮盖罩出现闪动的情况怎么办”吧!具体代码如下所示:
<div id="div2"></div> <div id="div3"> <p>你好</p> </div>
这是html代码部分,原本想做一个遮盖罩的效果,当鼠标移动到div2的时候,div3会出现微微遮一下div2.
所以最开始的css代码是这样的

做完后发现出了一个问题,那就是鼠标移动到div2的时候div3会不停的闪烁。这并不是我想要的效果,于是我去找了很多资料,终于找到了原因
原来,当鼠标移动到div2的时候,div3会出现,这样鼠标就会在div3上,而不是在div2上面。于是div2又会消失,如此反复。
解决方法也很简单,将div2:hover代码换成如下就能完美解决了。

最终效果如下

总结
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
看完这篇文章后决定用第三个方法,其实很想用jq的,方便灵活,咨询了好多老前辈后,得知Js控制DOM在性能上影响比较大,能用css和html解决就不要用js了。HTML代码如下复制代码<divid="container"><div>.........</div><divclass="push"><!--notputanythinghere--></div></div><divid="footer">FooterSection</div>CSShtml,bo ...
这篇文章主要介绍了移动端html5判断是否滚动到底部并且下拉加载,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
本篇文章主要的介绍了关于HTML5 section标签的定义以及它的用法,最后还有一个案例总结,现在让我们开始阅读这篇文章吧
这篇文章主要介绍了AmazeUI 列表的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
在css3中,我们使用animation与keyframes结合,可以给元素添加各种各样的动画效果。这篇文章主要介绍了css3实现多个元素依次显示效果,需要的朋友可以参考下
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 ICP核准(ICP备案)粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008