[Support request] Javascript event for opening off canvas panel

[Shield one,]

Hello,

We would like to know if generatepress has its own javascript event which is triggered when mobile menu is opened (now we are using off canvas panel as mobile menu).

We are using javascript to animate ( fade in) menu items in the off canvas panel. Now we are listening and waiting to “on click” event of the hamburger (menu-toggle). It works just fine but we would like to know if there is some “better way” to do that. So we are looking for some special event which is triggered when mobile menu is opened instead of hamburger click event.

[David]

Hi there,

so one of the things the off canvas script does is to toggle the slide-opened class on the body ( and HTML ) elements.

If you’re using CSS Animations then you could simply use that class in your CSS.

If you’re using JS then you can in your own eventListener check if the class is on the body:

document.body.classList.contains("slide-opened")

This may be slightly better then listening for the Hamburger click, as the click adds the Class and that class is used to display the off canvas. This avoids the animation running before the off canvas is actually open.

[Shield one,]

Thank you for your helpful suggestions.

We added the contains() method to the JS eventListener to check if the “slide-opened” class is on body.

[David]

Glad to be of help!

[Author]

Posts