所有栏目 | 前端源码 2021Web前端自学笔记
你的位置：首页 > 前端代码 » 正文

最简洁的JS代码实现鼠标移入显示二维码

发布时间：2020-03-19 16:45:45

作品分类：前端  代码  二维码
<script type="text/javascript"> 
function showImg(){ 
document.getElementById("wxImg").style.display='block'; 
} 
function hideImg(){ 
document.getElementById("wxImg").style.display='none'; 
} 
</script> 
      <li><a href="javascript:void(0)" onMouseOut="hideImg()" onmouseover="showImg()"><img src="小图片地址" /></a></li>
<div id="wxImg" style="display:none;height:50px;back-ground:#f00;position:absolute;    z-index: 999;"><img src="二维码图片地址" /></div>

以上js部分，几行代码搞定，然后将li代码放在需要出现二维码的地方。这样就轻松实现二维码效果。
同时还得配合下CSS来实现各种漂亮效果。
前几年做的某个站专门研究了下。


 

Top