js鼠标经过文字显示图片预览，jquery效果

来源：互联网发布：seo基础教程编辑：程序博客网时间：2024/05/16 05:40

<!DOCTYPE HTML><html>    <head>        <title></title>        <style>            .wrap {                position:relative;            }            .inner {                display:none;                position:absolute; top:30px; left:100px;                width:100px; height:100px;                border:0px solid #000;                background:#fff;            }        </style>    </head>    <body>        <div class="wrap">            <a href="">当鼠标指到我，出来图片</a>            <div class="inner">                <img src="./1.jpg" />                   </div>        </div>        <script>            var $ = function(id){                return document.getElementById(id);            };            var $t = function(tag, cot){                cot = cot || document;                return cot.getElementsByTagName(tag);            };            $t('a')[0].onmouseover = function(){                $t('div', this.parentNode)[0].style.display = 'block';            }            $t('a')[0].onmouseout = function(){                $t('div', this.parentNode)[0].style.display = 'none';            }                   </script>    </body></html>

1 0