Topic: Sidenav Collpase for Slim as Popover
The expected behavior of the sidenav in slim mode is to expand the sub-navigation and show the wider version when you click on a navigation header.
I want to stop this functionality and use a popover to display the collapsed sub navigation. On a navigation header click using preventDefault, stopImmediatePropagation and return false will only stop the navigation bar from getting wider. The collapsed navigation still shows up.
Is there any way to prevent the sub-navigation from opening?
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Resolved
Specification of the issue
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 3.9.0
- Device: Desktop
- Browser: Firefox
- OS: Windows
- Provided sample code: No
- Provided link: No
Related topics
Michał Duszak staff commented 3 years ago
https://mdbootstrap.com/snippets/standard/m-duszak/3197039 Referencing to this snippet - you want to prevent any action on clicking the "Category 1" and "Category 2", so that sidenav bar will not collapse? And you want different animation to occur on click?
Here's an immediate opening: https://mdbootstrap.com/snippets/standard/m-duszak/3197045
mattybaer pro premium priority commented 3 years ago
Not quite. Neither of those examples stops the slim nav from expanding larger when opening the submenu. I want to use Popover for subnav instead of collapsible in slim mode. Currently, I can't find a way to prevent the subnav from opening on a Category 1 click. So functionality would be on a click of "Category 1" when in Slim mode is to prevent all current functionality and then open a popover. I am almost there, but can't seem to prevent the collapsible actions from happening. My thoughts are now to hide it with CSS as preventing in JS seems to be futile.
mattybaer pro premium priority commented 3 years ago
CSS did the trick. Thanks for your time, sorry to waste it.