- This topic has 5 replies, 3 voices, and was last updated 2 years, 5 months ago by
.
-
Posts
-
Hey guys,
I’m using a GeneratePress Block Element to create a custom mobile menu using the
inside_slideout_navigationwhich is working like a charm. The issue I’m running in to is that the custom menu items are smooth-scrolling anchor links to sections on the homepage. I think since this is a custom menu the Off-Canvas panel isn’t getting closed when a link is clicked. Any suggestions on how to achieve this? You can take a look at what I mean on mobile here: https://ignitevideostrategy.com/.Ideally, the menu will close on mobile whenever a link is clicked inside the inside_slideout_navigation element.
Customer Support
Hi Clayton,
I’m afraid it’s not possible without custom development.
Maybe give the default mobile menu a try?
Bummer
Customer Support
Hi Clayton,
If it’s about link toggling the off-canvas menu, maybe I can help.
Will the behavior be a simple close/open?
IF that’s the case, try this script:
<script> const OffCanvasPanel = document.querySelector('nav#generate-slideout-menu'); const htmlTag = document.querySelector('html'); const bodyTag = document.querySelector('body'); var OffCanvasPanel_btns = OffCanvasPanel.querySelectorAll('a.gb-button.menu-item'); function dbHandleClick(evt) { for (var y = 0; y < OffCanvasPanel_btns.length; y++) { if ( OffCanvasPanel_btns[y] == evt.target ) { htmlTag.classList.remove('slide-opened'); bodyTag.classList.remove('offside-js--is-open', 'offside-js--is-left'); OffCanvasPanel.classList.remove('is-open'); } } } window.addEventListener("click", dbHandleClick); </script>Thanks Elvin, I’ll give that a shot. I found a work around using some code you posted to create a shortcode for any menu so I created a menu, added the items I want, and then added some style. Then I’m outputting the menu in my element. Since I’m now using a default menu the close function seems to be working properly. Thanks again!
No problem. Let us know if you need further help w/ this. 😀
- You must be logged in to reply to this topic.