鼠標滑過切換div顯示（鼠標事件）

本文轉載自查看原文 2017-12-29 16:49 2064 html/ css/ js

<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>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 jQuery 鼠標滑過Div變色鼠標滑過右側顯示菜單 js實現網頁全屏切換（平滑過渡），鼠標滾動切換網頁面html簡單實現tab鼠標經過切換欄目文章 vue中tab欄鼠標經過切換對應內容鼠標滑過顯示下拉菜單 jquery之鼠標滑過圖片mousemove事件簡單的三種實現鼠標經過切換圖片的方法 css樣式控制鼠標滑過顯示 jQuery hover事件鼠標滑過圖片半透明標題文字滑動顯示隱藏