琴&
2018-12-14 13:55为什么我这样改用的js没有实现?
原css代码
#dropdown:hover #dropdown-list {
display: block;
}
我该用的原生JS代码
var onMainbtn0 = document.getElementById("dropdown-dropbtn0");
var onMainbtn1 = document.getElementById("dropdown-dropbtn1");
var onMain_target0 = document.getElementById("dropdown-list0");
var onMian_target1 = document.getElementById("dropdown-list1");
function onMain(){
onMainbtn0.onmouseover = function(){
onMain_target0.style.display = "block";
}
onMainbtn1.onmouseover = function(){
onMain_target1.style.display= "block";
}
onMainbtn0.onmouseout = function(){
onMian_target1.style.display="none";
}
onMainbtn1.onmouseout = function(){
onMian_target0.style.display="none";
}
}
这里是html中部分代码
<div id="guilde-dropdown">
<button id="dropdown-dropbtn0">按钮1</button>
<button id="dropdown-dropbtn1">按钮2</button>
</div>
<div id="dropdown-list">
<div id="dropdown-list0">
<a href="javascript:void(0)">下拉1</a>
</div>
<div id="dropdown-list1">
<a href="javascript:void(0)">下拉1'</a>
</div>
</div>
实现的功能:接触下拉菜单:鼠标移动到按钮显示下拉菜单
下拉菜单的内容开始时隐藏(display:none)
- 点赞
- 回答
- 收藏
- 复制链接分享
1条回答
为你推荐
- JSP中引入CSS后,关于CSS中图片路径的问题
- it技术
- 互联网问答
- IT行业问题
- 计算机技术
- 编程语言问答
- 0个回答
- jquery tabs使用$()多次加载页面问题
- jquery
- 0个回答
- 为什么我这样改用的js没有实现?
- javascript
- css
- 1个回答