Topic: Panel to slide in from the right
chrislennon pro premium priority asked 3 years ago
Hi there
I am trying to achieve a result where a panel (showing online help in my case) will slide into view from the right. Clicking outside this panel should close it. I don't think a sidenav is quite right as this is just a panel with information
I think a model may be best, but there seems to be no 'frame-modal right' option, just top and bottom. Also the modal should not cover the top menu, i.e. there should be a gap between the top of the page and the modal
I have cloned the admin template for my snippet (URL below), and just made one change, to put a 'show help' button on the top navbar. When clicked the side panel should slide out. The effect would be similar to https://mdbootstrap.com/snippets/jquery/piotr-glejzer/215892 (just with a gap at the top so the 'show help' button isn't covered)
How could this be achieved with mdbootstrap?
thanks
Chris
*Resources (screenshots, code snippets etc.)*See snippet https://mdbootstrap.com/snippets/standard/chrislennon/3774867
Grzegorz Bujański staff answered 3 years ago
Bootstrap provides a new component - offcanvas. You can also use it in MDB: https://mdbootstrap.com/docs/standard/extended/offcanvas/ If I understand correctly, this is the solution you are looking for.
chrislennon pro premium priority commented 3 years ago
Thank you that worked perfectly. Documentation was also very helpful
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 3.11.0
- Device: Laptop
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: Yes