zoukankan      html  css  js  c++  java
  • JS超链接动态显示图片

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
    <meta charset="utf-8" />
        <script>
            onload = function () {
                var al = document.getElementById('al');
                al.onmouseover = function () {
                    if (document.getElementById('dv')) {
                        document.body.removeChild(document.getElementById('dv')); //防止重复添加
                    }

                    var dvObj = document.createElement('div');
                    dvObj.id = 'dv';
                    var imgObj = document.createElement('img');
                    imgObj.src = '2.jpg';
                    imgObj.width = '200';//不可以加px
                    imgObj.height = '200';
                    dvObj.appendChild(imgObj);
                    dvObj.style.position = 'absolute';
                    dvObj.style.left = this.offsetLeft + 'px';
                    dvObj.style.top = this.offsetTop + this.offsetHeight + 'px';



                    document.body.appendChild(dvObj);


                }
                al.onmouseout = function () {
                    if (document.getElementById('dv')) {
                        document.body.removeChild(document.getElementById('dv'));
                    }
                }
            }
        </script>
    </head>
    <body>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a id="al" href="http://www.baidu.com">百度一下</a>
        <!--<img src="2.jpg" width="200" height="200"/>-->
    </body>
    </html>
  • 相关阅读:
    远程连接Mysql报错 java.sql.SQLException:null,message from server ... is not allowed to connect
    使用 java.util.Properties 读取配置文件中的参数
    重载Prometheus配置
    Redis的 SLAVEOF 命令
    Redis为什么不能使用一主一从哨兵
    iptables添加开放端口
    解决172.17 或者172.18 机房环境下harbor服务器不通的问题
    利用sshpass批量导入ssh-key
    ZABBIX_PROXy
    zabbix_server.conf
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434856.html
Copyright © 2011-2022 走看看