
鼠标经过显示隐藏的div,怎么才可以让隐藏的div在对应标签的右边显示出来。下面代码隐藏的div在下面显示
怎么才可以让它在右边显示出来?(像下面图片的效果那样)<head><metacharset="UTF-8"><title>Document</title><script>...
怎么才可以让它在右边显示出来?(像下面图片的效果那样)<head> <meta charset="UTF-8"> <title>Document</title> <script> function ddd(obj, sType) { var oDiv = document.getElementById(obj); if(sType == 'show') { oDiv.style.display = 'block'; } if(sType == 'hide') { oDiv.style.display = 'none'; } } </script> </head> <body> <a href="#" onmouseover="ddd('aa', 'show');" onmouseout="ddd('aa', 'hide');">显示1</a> <br/> <a href="#" onmouseover="ddd('bb', 'show');" onmouseout="ddd('bb', 'hide');">显示2</a> <div style="display:none;" id="aa" onmouseover="ddd('aa', 'show');" onmouseout="ddd('aa', 'hide');"> <a href="#">aa </a> <a href="#">aa </a> <a href="#">aa </a> <a href="#">aa </a> <a href="#">aa </a> </div> <div style="display:none;" id="bb" onmouseover="ddd('bb', 'show');" onmouseout="ddd('bb', 'hide');"> <a href="#">bb </a> <a href="#">bb </a> <a href="#">bb </a> <a href="#">bb </a> </div> </body>
展开
2个回答
展开全部
写代码要秉承着可以用css解决的就不用js的理念
css部分
div{
display: none;
}
.aa:hover div{
display: inline-block;
}
.bb:hover div{
display: inline-block;
}
html部分
<span class="aa">
<span>显示1</span>
<div>
<a href="#">aa</a>
<a href="#">aa</a>
<a href="#">aa</a>
<a href="#">aa</a>
</div>
</span>
<br>
<span class="bb">
<span>显示2</span>
<div>
<a href="#">bb</a>
<a href="#">bb</a>
<a href="#">bb</a>
<a href="#">bb</a>
</div>
</span>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询