OffCanvas

  1. Bootstrap
  2. OffCanvas
Basic

Offcanvas is a sidebar component that can be toggled via JavaScript .

Offcanvas
Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.
Four Directions

Four options are available: top, right, bottom, and left aligned.

Offcanvas
Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.
Offcanvas right
...
Offcanvas top
...
Offcanvas bottom
...
Body Scroll

Offcanvas is a sidebar component that can be toggled via JavaScript. Use one of this attribute to enable or disable scroll data-bs-scroll="true" data-bs-backdrop="false"

Colored with scrolling

Try scrolling the rest of the page to see this option in action.

Backdrop

Offcanvas is a sidebar component that can be toggled via JavaScript. Use one of this attribute to enable or disable scroll data-bs-scroll="false" data-bs-backdrop="true"

Click Me

.....

Backdrop with Body Scroll

Offcanvas is a sidebar component that can be toggled via JavaScript. Use one of this attribute to enable or disable scroll data-bs-scroll="true" data-bs-backdrop="true"

Enable both scrolling & backdrop

Try scrolling the rest of the page to see this option in action.