在JS中实现鼠标挪移上去时图片放大显示移开时关闭

准备一个html文档

并且设置两张图片

 

<img id="pic" src="img/img/1.jpg" οnmοuseοver="showImg()" οnmοuseοut="hideImg()" />         <div id="big_pic">             <img src="img/img/1.jpg"/>         </div>

然后是JS中的代码

    function showImg(){                 document.getElementById("big_pic").style.display="block";             }     function hideImg(){                 document.getElementById("big_pic").style.display="none";             }

分别为隐藏和显示图片

然后通过设置的方法执行 鼠标不在小图片上时 效果如下

当鼠标挪移上时  显示