Closing the side menu if open using a JavaScript trigger

Feb 13, 2024

Is there a way to verify if the menu is open, close it using JavaScript and if it's closed, do nothing?

At the moment I can only toggle it using this JavaScript.

document.querySelector("#hamburger > div").click();

14 Replies
Michael Marchand

This code is not working for some reason.

var modernPlayerMenu = document.querySelector("#hamburger > div");
var isMenuOpen = document.body.classList.contains("sidebar-open");

if (isMenuOpen) {
// The menu is open, so close it
if (modernPlayerMenu) {
modernPlayerMenu.click();
}
} else {
// The menu is already closed, do nothing
}

Walt Hamilton

So maybe I wasn't clear. I don't ask why you want to close it; I'm asking why you need to check if it's open.  Close it when you start the timeline. If it's already closed, it doesn't change if you close it. Seems to me to be less work, and fewer moving parts. On the other hand, look at what you learned by trying it that way. Maybe it was worth it.  :)

Michael Marchand

Your right, I don't need to check if it's open. I still had the toggle trigger still in mind so I had to check if it was open to trigger the toggle code.


 var modernPlayerMenu = document.querySelector("#hamburger > div");
var isMenuOpen = ! document.body.classList.contains("sidebar-closed");
if (isMenuOpen) {
  modernPlayerMenu.click();
}


Jürgen Schoenemeyer

you can remove the hamburger button from the tab-key sequence with

document.getElementById("hamburger").tabIndex = -1;

and reactivate the old state with

document.getElementById("hamburger").tabIndex = 0;

 

if you want, you can also deactivate the hamburger menu (without hiding)

document.getElementById("hamburger").style.pointerEvents = "none";

and reactivate with

document.getElementById("hamburger").style.pointerEvents = "";