Offcanvas

This documentation provides a comprehensive reference for the Offcanvas component, guiding you through its configuration options.
Demos

Screenshot #

Blazor Offcanvas Component

Parameters #

Name Type Default Required Description Added Version
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
BodyCssClass string? null Gets or sets the body CSS class. 1.0.0
BodyTemplate RenderFragment? null Gets or sets the body template. 1.0.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
CloseOnEscape bool True If true, offcanvas closes when escape key is pressed. 1.0.0
FooterCssClass string? null Gets or sets the footer CSS class. 1.0.0
FooterTemplate RenderFragment? null Gets or sets the footer template. 1.0.0
HeaderCssClass string? null Gets or sets the header CSS class. 1.0.0
HeaderTemplate RenderFragment? null Gets or sets the header template. 1.0.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
IsScrollable bool False Indicates whether body scrolling is allowed while offcanvas is open. 1.0.0
Placement Placement End Gets or sets the offcanvas placement. 1.0.0
ShowCloseButton bool True If true, modal shows close button in the header. 1.0.0
Size OffcanvasSize Regular Gets or sets the offcanvas size. 1.0.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0
TabIndex int -1 Gets or sets the tab index. 1.0.0
Title string? null Gets or sets the offcanvas title. 1.0.0
UseStaticBackdrop bool False When `UseStaticBackdrop` is set to true, the offcanvas will not close when clicking outside of it. 1.0.0

Methods #

Name Return type Description Added Version
HideAsync() Task Hides an offcanvas. 1.0.0
ShowAsync() Task Shows an offcanvas. 1.0.0
ShowAsync(string title, Dictionary<string, object>? parameters) Task Opens a offcanvas. T is component. 1.0.0

Events #

Name Return Type Description Added Version
OnHidden EventCallback This event is fired when an offcanvas element has been hidden from the user (will wait for CSS transitions to complete). 1.0.0
OnHiding EventCallback This event is fired immediately when the hide method has been called. 1.0.0
OnShowing EventCallback This event fires immediately when the show instance method is called. 1.0.0
OnShown EventCallback This event is fired when an offcanvas element has been made visible to the user (will wait for CSS transitions to complete). 1.0.0
If you like Blazor Bootstrap, give it a star on GitHub!
Blazor Bootstrap Blazor Bootstrap
  • Designed and built with all the love in the world by the Blazor Bootstrap team with the help of our contributors.
  • Code licensed Apache License 2.0.
  • Currently v4.0.0.
  • Powered by .NET 10.0.0
Links
Guides
Community
Other Libraries

Rejoining the server...

Rejoin failed... trying again in seconds.

Failed to rejoin.
Please retry or reload the page.

The session has been paused by the server.

Failed to resume the session.
Please reload the page.