鼠标滑过切换div显示（鼠标事件）

最新推荐文章于 2023-05-30 17:54:43 发布

njit_peiyuan

最新推荐文章于 2023-05-30 17:54:43 发布

阅读量1.3k

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/MrRead/p/8145300.html

版权

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>div切换</title>
<style type="text/css">
.dj{
    width: 400px;
    height: 400px;
    background-color:#A18325;
    display:none;
}
</style>
<script type="text/javascript">
window.onload = function (){
    var x1=document.getElementById("as");
        x1.onmouseover= function (){
            var xd1=document.getElementById("dg1");
                xd1.style.display='block'
            var xx1=document.getElementById("dg2");
                xx1.style.display='none'
        }
    var x2=document.getElementById("bs");
        x2.onmouseover= function (){
            var xd1=document.getElementById("dg2");
                xd1.style.display='block'
            var xx1=document.getElementById("dg1");
                xx1.style.display='none'
        }
}
</script>
</head>
<body>
<div style="width: 50px; height: 50px;background: #3355dd;" id="as"></div>
<div style="width: 50px; height: 50px;background: #6622dd;" id="bs"></div>
<div class="dj" id="dg1"> <br />
            第一个111111111111</div>
<div class="dj" id="dg2"> <br />
            第二个222222222222</div>

</body>
</html>

转载于:https://www.cnblogs.com/MrRead/p/8145300.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

njit_peiyuan

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
鼠标滑过切换div显示（鼠标事件）

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>div切换</title><style type="text/css">.dj{ width: 400px; h...
复制链接

扫一扫