OffCanvas Toggle
Live Demo
Use the buttons below to show and hide an offcanvas element via JavaScript that toggles the .show class on an element with the .offcanvas class.
Placement (No toggle conflict)
Offcanvas Different Placement Example: Top, Right & Bottom
Backdrop
Scrolling the body is disabled when an offcanvas and its backdrop are visible. Use scroll and backdrop properties to control behavior.
Offcanvas with body scrolling
Try scrolling the rest of the page to see this option in action.
Offcanvas with static backdrop
I will not close if you click outside of me.
Backdrop with scrolling
Try scrolling the rest of the page to see this option in action.