Last active
April 3, 2023 10:02
-
-
Save Garconis/a3855dbd7bfb7eeaebe1601d11b33979 to your computer and use it in GitHub Desktop.
Divi | WordPress Theme | Mobile Menu Collapsible Submenus via Toggles | CSS & jQuery Tweaks in action: https://i.gyazo.com/93557e9ef5d4aad260e22c6d5896de3b.mp4
Thanks for sharing your code @Garconis. I fully agree, this should be standard in a payed theme nowadays, I fail to understand why they didnt build this in right away. Anyways youve got us covered. Thanks!
I also removed this CSS code. It was not allowing the menu to scroll if it was too tall and the header was fixed:
/* remove pointer event from menu module mobile wrapper */
.et_pb_module.et_pb_menu .et_mobile_nav_menu {
pointer-events: none;
}
/* make menu module hamburger icon and menu links interactive again */
.et_pb_module.et_pb_menu .et_mobile_nav_menu .mobile_menu_bar,
.et_pb_module.et_pb_menu .et_mobile_nav_menu .et_mobile_menu li a {
pointer-events: auto;
}
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
For the Javascript to work you have to enclose it inside
$(document).ready(function () { /* all calls here */ });
, because the "ul.et_mobile_menu" element is only appended to the page (by JavaScript/jQuery) after it loads (if you use the Chrome to view the page source you don't see any "ul.et_mobile_menu" element). You could also use setTimeout.I also removed the "et_pb_menu" class reference from the CSS and JavaScript, because the Divi Theme Builder doesn't use it.