需要Javascript下拉菜单上的帮助吗
所以本质上我不明白为什么当我点击汉堡包图标时这个菜单不会下拉，任何帮助都将不胜感激需要Javascript下拉菜单上的帮助吗,javascript,menu,onclick,toolbar,dropdown,Javascript,Menu,Onclick,Toolbar,Dropdown,所以本质上我不明白为什么当我点击汉堡包图标时这个菜单不会下拉，任何帮助都将不胜感激 Javascript: function myFunction(){ var hamburger=document.getElementById('nav-btn') var dropdownContent=document.getElementsByClassName('nav') hamburger.onclick=dropdownContent.classList.toggle
Javascript:
function myFunction(){
var hamburger=document.getElementById('nav-btn')
var dropdownContent=document.getElementsByClassName('nav')
hamburger.onclick=dropdownContent.classList.toggle("show");
//or hamburger.onclick=dropdownContent.style.display("block");
}
CSS:
#nav-btn {
display: none;
}
@media (max-width: 1099px) {
li {
display: none;
}
#nav-btn {
display: inline;
position: absolute;
right: 10px;
bottom: 110px;
}
#nav-btn:hover {
content: url('Menu.png');
}
HTML:
<html>
<body>
<span id="nav-btn"><image src="Menugreen.png" input type="button" onclick="myFunction()"/></span>
<div class="nav">
<ul>
<li id="Programs"> <a href="Programs.html"> Programs </a> </li>
<li> <a href="Tshirts.html"> T-Shirts </a> </li>
<li> <a href="About.html"> About </a> </li>
</ul>
</div>
</body>
</html>
Javascript:
函数myFunction（）{
var hamburger=document.getElementById（'nav-btn'）
var dropdownContent=document.getElementsByClassName（'nav'）
hamburger.onclick=dropdownContent.classList.toggle（“show”）；
//或者hamburger.onclick=dropdownContent.style.display（“块”）；
}
CSS:
#导航基站{
显示：无；
}
@介质（最大宽度：1099px）{
李{
显示：无；
}
#导航基站{
显示：内联；
位置：绝对位置；
右：10px；
底部：110px；
}
#导航基站：悬停{
内容：url（'Menu.png'）；
}
HTML:
再一次，我只是想咨询一下为什么nav btn的下拉span id没有下拉ul的内容，其他一切都正常。谢谢！您试图切换
showshow//获取DOM引用
var hamburger=document.getElementById（'nav-btn'）
var dropdownContent=document.querySelector（'.nav'）
//设置事件处理程序
hamburger.addEventListener（“单击”，函数（）{
dropdownContent.classList.toggle（“隐藏”）；
})；#导航btn{
显示：无；
}
@介质（最大宽度：1099px）{
.隐藏{
显示：无；
}
#导航基站{
显示：内联；
位置：绝对位置；
右：10px；
底部：110px；
}
/*将鼠标悬停在图像上而不是跨距上时更改图像*/
#导航btn>img：悬停{
内容：url（'Menu.png'）；
}
}
显示显示//获取DOM引用
var hamburger=document.getElementById（'nav-btn'）
var dropdownContent=document.querySelector（'.nav'）
//设置事件处理程序
hamburger.addEventListener（“单击”，函数（）{
dropdownContent.classList.toggle（“隐藏”）；
})；#导航btn{
显示：无；
}
@介质（最大宽度：1099px）{
.隐藏{
显示：无；
}
#导航基站{
显示：内联；
位置：绝对位置；
右：10px；
底部：110px；
}
/*将鼠标悬停在图像上而不是跨距上时更改图像*/
#导航btn>img：悬停{
内容：url（'Menu.png'）；
}
}
value=--value=--