js实现鼠标悬停显示二维码或图片 可控制大小

head 之间增加

        <script type="text/javascript">
    function show (obj)
    {
        var img = document.getElementById ("showimg");
        if (img.src = obj.src)
        {
            img.src = "1.png";
        }
        img.style.display = "";
        img.style.position = "absolute";
        img.style.left = obj.offsetleft + obj.width;
    }
    function hide ()
    {
        document.getElementById ("showimg").style.display = "none";
    }
</script>

调用：

        <img src="2.png" onmouseover="show(this)" onmouseout="hide()" width=100 height=100>
    <br>
    <img src="1.png" id="showimg" style="display: none" height=300>

其中1.png  为停留图标或图片

2.png 为鼠标划过 显示的图片  width和height为控制大小

效果测试如：

        <script type="text/javascript">
    function show (obj)
    {
        var img = document.getElementById ("showimg");
        if (img.src = obj.src)
        {
            img.src = "http://www.rmbox.cn/photo-wudong/kfewm.jpg";
        }
        img.style.display = "";
        img.style.position = "absolute";
        img.style.left = obj.offsetleft + obj.width;
    }
    function hide ()
    {
        document.getElementById ("showimg").style.display = "none";
    }
</script>

             承接搭建、小改、定制一条龙服务<br>
             测试用户名 admin 密码 admin888<br>
             前端PC测试： <a href="http://xx1.ao8.top" target="_blank">点这里跳转</a><br>
             前端H5测试： <a href="http://xx1.ao8.top/m" target="_blank">点这里跳转</a><br>
             如有需要请点击加微信联系我

<br><img src="http://www.rmbox.cn/photo-wudong/xswx.png" onmouseover="show(this)" onmouseout="hide()" width=100 height=100>
    <br><img src="http://www.rmbox.cn/photo-wudong/kfewm.jpg" id="showimg" style="display: none" height=300><br>