Skip to content

Instantly share code, notes, and snippets.

@JHethDev
Forked from lots0logs/epanel-integration-body.html
Last active August 6, 2019 19:56
Show Gist options
  • Save JHethDev/4474f4bb6c962c5331aa22e9a361c239 to your computer and use it in GitHub Desktop.
Save JHethDev/4474f4bb6c962c5331aa22e9a361c239 to your computer and use it in GitHub Desktop.
WordPress :: Divi Theme :: Slide-Out Navigation :: Close menu when any link is clicked or main content area is clicked while slide menu is open
<script>
var closeDelay = 100;
(function($) {
$(window).load(function() {
setTimeout(function() {
$('#main-content, .et_pb_fullscreen_nav_container a').each(function() {
$(this).click(function() {
setTimeout(function() {
if ($('.et_pb_slide_menu_opened').is(':visible')) {
$('.et_toggle_slide_menu').trigger('click');}
}, closeDelay);
});
});
}, 1200);
});
})(jQuery);
</script>
@JHethDev
Copy link
Author

JHethDev commented Feb 22, 2017

Divi Slide Menu Helper

Mirroring the mobile functionality of sites like Wikipedia.com where clicking the main content of the page when the slide in menu is open closes the menu drawer, also clicking any link closes the menu as created in the original gist.

Prerequisites

  • Using Divi Theme in Wordpress (Tested with 3.0)
  • Using the Slide In menu type chosen from the theme customizer
  • Extremely small amount of knowledge of Javascript

How to Use

Copy the Javascript snippet, navigate to the Divi Theme Options (Formerly ePanel) navigate to the Integrations tab and paste this code into the Add code to the < body > (good for tracking codes such as google analytics) section. Test to make sure it works.

Adjust Timing

I have included var closeDelay = 100 at the top of the code, the default value is 100 ms I like this speed it gives a nice feel after the click, you can make it 0 without much difference but if you increase anywhere above 1000 you will notice a significantly longer pause before it closes.

Author

JaySwaan

Acknowledgments

Based on the original script: WordPress :: Divi Theme :: Slide-Out Navigation :: Close menu when any link is clicked.
Created by: @lots0logs
Found here:
https://gist.github.com/lots0logs/dd862ac6d18a249bfc49

@YeahNahOK
Copy link

Hi JaySwaan, thanks for this bit of code, it works a treat, but not if you have a sub-menu. Clicking the parent triggers the close and the sub menu slips away into the abyss of non-existence ;'(

I don't suppose you would have a fix for this? I will be most appreciative of your input.

@dimension2am
Copy link

Yes, Love this Snippet!

But have the same issue as YeahNahOK. Would love to see an updated version of this that won't close when a submenu is expanded ;)

@Shahid-malik-bwp
Copy link

Fantastic.. Worked perfectly.. Thank you man and keep up the good work..

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment