- This topic has 9 replies, 3 voices, and was last updated 1 year, 6 months ago by
Tom.
-
AuthorPosts
-
June 22, 2019 at 10:34 am #938036
Sam
Hi, I have two small issues I wish to try and address:
1) when the off-canvas panel is open and viewed in chrome browser on ios, the bottom bar of the browser window obscures the last widget. So in my case, it is the WC basket widget and the buttons are obscured. If you fiddle around with swiping up and down you can eventually get to it. Is there a fix for this, maybe adding some padding or something to make the off-canvas panel long enough so the last widget sits above?
Please see my staging site (link provided).
I tested Firefox and that did not have the issue. However, Safari is the same but not quite as bad.
2) when the off-canvas panel is open, the page behind still scrolls sometimes when your swipe gestures intention is to move the off-canvas panel. Is there a way to stop this?
thanks
SamJune 22, 2019 at 5:10 pm #938225Tom
Lead DeveloperLead DeveloperHi there,
1. I’m not seeing this. Can you show us a screenshot?
2. Try this CSS:
.slide-opened body { overflow: hidden; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 23, 2019 at 7:59 am #938699Sam
Hi Tom,
1) see here: https://www.dropbox.com/s/502gnjwvqhm4vjv/IMG_2444.PNG?dl=0
2) can you explain what that css snippet was meant to do, I do not see any change.thanks
June 23, 2019 at 11:58 am #938845Tom
Lead DeveloperLead DeveloperWhat if you did this?:
.slideout-navigation .inside-navigation { padding-bottom: 50px; }
The other code should prevent any sort of scrolling when the off canvas panel is open. It seems to be working on my end?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 23, 2019 at 11:55 pm #939153Sam
Hi Tom, thanks, that CSS worked it just needed 100px to clear the frame in chrome iOS.
Regarding the scrolling issue, it’s a weird one to describe. If you swipe the overlay when the off-canvas menu is open then the page beneath scrolls. The problem is if you do this by accident then you cannot grab the off-canvas panel properly until the page has full stopped scrolling. Does that make sense?
A simple solution could be to add a setting in the customizer so you can set the width of the slide-out off canvas panel so you could have it full width?
thanks
SamJune 24, 2019 at 3:53 am #939307David
StaffCustomer SupportHi there,
in the Off Canvas panel options you have Style > Overlay this will cover the entire screen.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/June 24, 2019 at 8:52 am #939712Sam
Hi David, yes I have seen that, but the styling is completely different.
June 24, 2019 at 4:08 pm #940003Tom
Lead DeveloperLead DeveloperIf you swipe the overlay when the off-canvas menu is open then the page beneath scrolls. The problem is if you do this by accident then you cannot grab the off-canvas panel properly until the page has full stopped scrolling. Does that make sense?
The CSS I provided should make it so the page beneath can’t be scrolled.
However, the overlay style can be styled to look exactly like the slide style if full width suits you better – they both have the same options.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 24, 2019 at 11:25 pm #940175Sam
Hi Tom, right I see. It’s strange that it works differently for me. I will double check I executed that CSS properly. Noted on restyling the overlay. The reason I suggested setting the width of the slide-out was I thought it might involve less css.
June 25, 2019 at 8:31 am #940761Tom
Lead DeveloperLead DeveloperThe overlay option is already built in, so if you can make that work it’s the best method when it comes to using less CSS 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development -
AuthorPosts
- You must be logged in to reply to this topic.