I've created a script for a toggle button in the navigation bar. When clicked once, it should open the menu, and when clicked again, it should close it.
However, I'm facing an issue with this script.
Here's the Script:
const navSlide = () => {
const togg = document.querySelector('.toggle');
const navs = document.querySelector('nav-links');
togg.addEventListener('click', () => {
navs.classList.toggle('nav_ul_active');
});
}
Related HTML Code:
<div class="toggle" onclick="navSlide()">
<div class="menu"> <i class="fa fa-bars" aria-hidden="true"></i> </div>
</div>
<div class="nav-links">
<ul class="nav_ul">
<li><a href="#head-proj">Projects</a></li>
<li><a href="#head-about">About</a></li>
</ul>
</div>
Upon refreshing my website and clicking the button, I encounter the following error:
Uncaught TypeError: Cannot read property 'classList' of null at HTMLDivElement. (app.js:6)
The file 'app.js' is where the error occurs. How can I resolve this issue?