How To Toggle Bulma Navbar With Pure Javascript
Well, here it is...
const navbar = document.querySelectorAll('.navbar')[0];
const navs = navbar.querySelectorAll('a');
const burger = document.querySelectorAll('.navbar-burger')[0];
const menu = document.querySelectorAll('.navbar-menu')[0];
burger.addEventListener('click', function(e) {
burger.classList.toggle('is-active');
menu.classList.toggle('is-active');
});
for (var i = 0; i < navs.length; i++) {
if (!navs[i].classList.contains('navbar-burger')) {
navs[i].addEventListener('click', function() {
if (burger.classList.contains('is-active')) {
burger.classList.toggle('is-active');
menu.classList.toggle('is-active');
}
});
}
}
Thanks for reading. x
Resources
- Javascript: https://javascript.com