脚本我实现到我的网站不工作，我已经检查了一切，我沿着一个教程。任何想法？
链接到我的github存储库：https://github.com/DBvagabond/dbogdanski链接到webist预览：https://htmlpreview.github.io/?https://github.com/DBvagabond/dbogdanski/blob/main/index.html
超文本标记语言
<body>
<div class="navbar">
<div class="container">
<a class="logo" href="index.html"><span>d</span>bogdanski</a>
<img id="mobile-cta" class="mobile-menu" src="images/menu1.svg" alt="menu">
<nav>
<img id="mobile-exit" class="mobile-menu-exit" src="images/exit1.svg" alt="exit">
<ul class="primary-nav">
<li class="current"><a href="#">Work</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Shop</a></li>
<li><a href="#">Social</a></li>
</ul>
<ul class="secondary-nav">
<li class="contact-cta"><a href="#">Contact</a></li>
</ul>
</nav>
</div>
</div>
<section class="hero">
hero
</section>
<script>
const mobileBtn = document.getElementById('mobile-cta')
nav = document.querySelector('nav')
mobileBtnExit = document.getElementById('mobile-exit');
mobileBtn.addEventListener('click', () => {
nav.classList.add('menu-btn');
})
mobileBtnExit.addEventListener('click', () => {
nav.classList.remove('menu-btn');
})
</script>
</body>S CSS
.navbar {
background: var(--primary-color);
padding: 1em;
.logo {
text-decoration: none;
font-weight: bold;
color: var(--secondary-color);
font-size: 1.2em;
span {
color: white;
}
}
nav {
display: none;
}
.mobile-menu{
width: 1.5em;
cursor: pointer;
display: block;
}
.container {
display: flex;
place-content: space-between;
}
.mobile-menu-exit{
width: 1.5em;
float: right;
margin: .5em;
cursor: pointer;
}
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
section {
padding: 5em 2em;
}
nav {
position: fixed;
z-index: 999;
width: 66%;
right: 0;
top: 0;
background: grey;
height: 100vh;
padding: 1em;
ul.primary-nav {
margin-top: 5em;
}
li {
a{
color: var(--secondary-color);
text-decoration: none;
display: block;
padding: .5em;
font-size: 1.3em;
text-align: right;
&:hover {
font-weight: bold;
}
}
}
}我检查了错误，从author的存储库中复制并粘贴代码。单击汉堡菜单图标后，移动的菜单应弹出并关闭。
1条答案
按热度按时间oxiaedzo1#
为什么JavaScript在我的网站上不起作用？在网页浏览器菜单上点击“编辑”并选择“首选项”。在“首选项”窗口中选择“安全性”标签。在“安全性”标签的“网页内容”部分选中“启用JavaScript”复选框。点击网页浏览器的“重新加载当前页面”按钮刷新页面。