Question

我似乎无法使用锚标签上设置的onlick功能在较小的屏幕上显示隐藏的元素。我只是一个新手，还在学习基本的编码，我现在真的很困惑。我知道这是一个非常简单的问题，但我真的很想了解如何解决。我只是在家学习网页设计。

HTML

<nav>     
    <a class="toggle" href="" onclick="openNav()"><i class="fas fa-bars" > 
</i></a>
<ul>
    <li class="current"><a class = "navlinks" href = "">Home</a></li>
    <li><a class = "navlinks" href  = "Services.html">Services</a></li>
    <li><a class = "navlinks" href = "About.html">About</a></li>
    <li><a class = "navlinks pointer" 
onclick="document.getElementById('id01').style.display='block'" 
style="width:auto;">Login</a></li>
    <li><a class = "navlinks" href  = "Signup.html">Sign Up</a></li>
</ul>

</nav>

CSS

@media screen and (max-width:800px){
ul {
display:none; 
position: fixed;
padding: 20px;
border: 2px solid #FFB600;
background:#1a1a1a;
right: 15px;
width: 50%;
border-radius: 20px 0 15px 10px;
z-index:99999;

}

toggle{display:block;}

.toggle:hover{color:white;}

nav li {
text-align: center; 
width: 100%;
padding: 10px 0;
margin: 0;
}

}

JAVASCRIPT

function openNav() {
document.getElementsByTagName('ul').style.display = "block";

}

在此先感谢将为您提供帮助的人。

通过锚标记上的onlick从Javascript调用函数不起作用

0 个答案: