document.addEventListener('DOMContentLoaded', () => { let hamburgerMenu = document.querySelector('.hamburgerMenu'); let spNav = document.querySelector('.l-header__navbar-sp'); hamburgerMenu.addEventListener('click', () => { hamburgerMenu.classList.toggle('isActive'); document.querySelector('.l-header__row').classList.toggle('isWhite'); spNav.classList.toggle('isActive'); if(hamburgerMenu.classList.contains('isActive')) { hamburgerMenu.querySelector('.toggler').innerHTML = 'CLOSE'; } else { hamburgerMenu.querySelector('.toggler').innerHTML = 'MENU'; } }); });
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter