- This topic has 5 replies, 4 voices, and was last updated 3 years, 4 months ago by
.
-
Posts
-
Hi
Have you by any chance a snippet or CSS to get the sub items in an off canvas menu to flyout horizontally instead of the default dropdown?Thanks
Customer Support
Hi Mario,
Are you referring to Sliding in and out of the Off-Canvas menu? If so, there’s a Style option in Appearance > Customize > Layout > Off Canvas Menu. You can try setting that to Slide. Reference: https://docs.generatepress.com/article/off-canvas-panel-overview/
If you’re referring to something else, can you share a reference site that has your preferred Off-canvas menu so we can have an idea of what you’re going for?
Hi, thanks for the quick reply.
Not the sliding in and out, its more of a second level slidout.
So if a menu item have sub menu items it would slide out instead of dropdown.
You can look at this nav solution https://www.ssab.com/sv-seThanks
Customer Support
Hi there,
does this have to be the Off Canvas ?
As we have this site in our library titled: Sider
And here a user had the same requests, and Ying provided some CSS to make the sub menus flyout:
https://generatepress.com/forums/topic/submenu-customization-with-leftside-navigation/#post-1679442
Hi, thank you for the reply.
Basically that would be a great solution, but why I would like to have it in the off canvas is for the sliding effect.
And the example that I showed you wasn’t that good, here is a better one https://www.polestar.com/se/Thanks
Customer Support
It’s kinda tricky, you can give this CSS a try, but I don’t think it’s gonna work perfectly:
#generate-slideout-menu.main-navigation .main-nav ul ul { position: absolute; left: 0; height: 100vh; display: block !important; opacity: 0; transition:all 0.5s ease; } nav#generate-slideout-menu { overflow: visible; } #generate-slideout-menu.main-navigation .main-nav ul li:hover ul { visibility: visible; left: 265px; opacity:1; }
- You must be logged in to reply to this topic.
