Custom Animated Hamburger Menu - HTML, CSS

Question:
How can I add HTML to trigger a mobile hamburger menu?

Product:
Wix Studio Editor

What are you trying to achieve:
I am trying to create a CSS custom animation hamburger menu icon to open the mobile menu.

What have you already tried:
I’ve tried searching the community and YouTube and not seeing a clear answer on this. It seems like such a simple feature that I should be able to add with some HTML and CSS.

Additional information:
To reference the effect I am trying to achieve, please see https://codepen.io/fabean/pen/XXegoQ

Hi, Sal_Hakim !!

I think you can implement it by migrating the CodePen program (the HTML compiled from Pug and the CSS compiled from SCSS) into a custom element or inside an iframe. Personally, I recommend using a custom element, although it’s more challenging. After that, you can detect events triggered by clicks by using this.dispatchEvent() for custom elements or postMessage() for iframes to notify the page code of the event. You’ll also need to write the handling code yourself, such as “opening/closing the menu” when an event occurs. The CodePen program is just for design purposes, after all. :smiley: :+1: