-
Goodnight,
I would like to know if there is any way to block clicks outside the menu on mobile, in order to leave it open as in the example blog below.
As you can see on my website, if you click on the place outside the menu on mobile it closes: https://prnt.sc/9YGzvSS3PrpC
On blog 2, the menu remains open as if nothing had happened: https://prnt.sc/rB36yb0zJ3yq
Could you explain to me how to do this to resolve it on my website?
-
Hi there,
It requires custom JavaScript to alter the slideout nav’s behaviour.
How about setting the slideout nav width to 100%, so there’s no place to click?
-
Yes that would fix the issue, can you help me with that?
-
Hi there,
add this CSS to your site:
body { --gp-slideout-width: 100vw; } -
Thank you and now it is resolved.
I wanted to take the opportunity to ask if it is also possible to fill in this part of the menu when clicked so it doesn’t look weird: https://prnt.sc/XlB3iJl8IKEo
-
1. change this CSS:
#generate-slideout-menu .inside-navigation { padding-inline: 10px; }to:
#generate-slideout-menu .inside-navigation { padding-inline: 0; }2. change this CSS:
#generate-slideout-menu .main-nav > ul > li > a { padding-left: 0; border-bottom: 1px solid #910A00; }to:
#generate-slideout-menu .main-nav > ul > li > a { padding-left: 10px; border-bottom: 1px solid #910A00; } -
And another question, how can I define that it is only possible to close the menu by clicking on the “x” and not on the top bar without any content at the top?
Screenshot: https://prnt.sc/QXn5Sm3XYKDh
-
Change this:
.slideout-navigation button.slideout-exit { text-align: right; }to:
.slideout-navigation button.slideout-exit { max-width: 60px; margin-left: auto; text-align: right; } -
It worked thanks for your excelent support!
-
You are welcome 🙂
- You must be logged in to reply to this topic.