解决onmouseover与onmouseout共存不断闪烁的问题

最新推荐文章于 2021-09-01 20:53:14 发布

code301

最新推荐文章于 2021-09-01 20:53:14 发布

阅读量3.2k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： HTML

本文链接：https://blog.csdn.net/AnPHPer/article/details/79669408

HTML 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种解决网页中图片预览时出现闪烁现象的方法。通过调整显示层的CSS属性pointer-events为none，有效避免了鼠标悬停事件触发时元素的频繁显示与隐藏所导致的视觉闪烁问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

onmouseover与onmouseout共存不断闪烁

<input id="sdqinfoimg" type="hidden" value="a.jpg"/>

<img src="a.jpg" height="100" onmouseover="showimg('sdqinfoimg');" onmouseout="hideimg();"/>

<div id="sdqinfo_show_div" style="position:absolute; top:10%; left:300px;z-index:999;display:none;">

    <img id="sdqinfo_getimg" width="400" src=""/>

</div>

function showimg(val){
	 var value=$("#"+val).val();
	 if(value!==""){
		 $("#sdqinfo_getimg").attr("src",+value); 
		 $("#sdqinfo_show_div").show(); 
	  }
}

function hideimg(){
	$("#sdqinfo_getimg").attr("src","");  
	 $("#sdqinfo_show_div").hide();
}
</script>

试了 mouseenter和 mouseleave但是并不能实现不闪烁

于是在id为