个人中心
gpt4 book ai didi

javascript - 我想制作一个可以用 javascript 隐藏和取消隐藏的导航栏

转载 作者：行者123 更新时间：2023-11-28 19:29:15 25 4
gpt4 key购买 nike

我想制作一个可以使用 javascript 隐藏和取消隐藏的导航栏。我知道这应该在 jsfiddle ( http://jsfiddle.net/3pu868em/ ) 中工作。任何帮助将非常感谢。我知道这是我做错的事情。感谢您的帮助。

<!DOCTYPE html>
<html lang="en">
<head>
<title>Hide the Navigation</title>
<style>
.hidding{
    display: none;
}
</style>
</head>
<body>
<nav>
   <ul>
       <a href="#"></a><li>Home</li></a>
       <a href="#"></a><li>Contents</li></a>
       <a href="#"></a><li>Social Media</li></a>
   </ul>
   <div class="handle">Menu</div>
</nav>
<script>
$('.handle').on('click', function(){
            $('nav ul').toggleClass('hidding');               
      });
</script>
</body>
</html>

最佳答案

请确保在脚本之前包含 jQuery。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$('.handle').on('click', function(){
    $('nav ul').toggleClass('hidding');               
});
</script>

关于javascript - 我想制作一个可以用 javascript 隐藏和取消隐藏的导航栏，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27199295/

25 4 0
文章推荐： html - SVG 元素有太多额外空间
文章推荐： python - 使用 cx_Freeze 构建 msi : ValueError: FCI error 1
文章推荐： ios - 是否可以创建具有弯曲底边的 UIView。
文章推荐： javascript - 为什么即使稍后在代码中定义了局部变量，全局变量也无法访问