Offcanvas component of Boostrap helps to build sidebar navigations or to add shopping carts for e-commerce websites. Additionally, a JavaScript plugin can be used for adding some other functionalities. 

 

It is a sidebar component that can be added with the help of JavaScript plugins. Also, the button tag and anchor tag can be even feasible to use for Offcanvas. Similar to modal, an Offcanvas can only have a single viewable window. Also, it has backdrop settings options that hide the content by default.

 

The Offcanvas components can be added using .offcanvas in class. You can access and build live demos,  toggleable content, backdrops, and placements. There’s no difference between adding other functionality.

 

For example,

<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvastrial">

  <div class="offcanvas-header">

    <h4 class="offcanvas-contact us" id="offcanvasLabel">Offcanvas check</h4>

    <button type="button" class="btn-close " data-bs-dismiss="offcanvas" aria-label="Close"></button>

  </div>

  <div class="offcanvas-body">

    Trial example to write content on body

  </div>

</div>

 

Subscribe For Daily Updates