Carousel - bit BlazorUI
Home Docs

Carousel

Carousel (Carousel slide-show) let people show their items in seperate slides from two or more items.

Usage

Basic Carousel
1 / 4
2 / 4
3 / 4
4 / 4
InfiniteScrolling Carousel
Aurora
This is Aurora and it's fantastic
Beautiful Mountain
This is a Beautiful Mountain and it's gorgeous
Forest In The Valley
This is a Forest In The Valley and it's beautiful
Road Among The Mountains
This is a Road Among The Mountains and it's amazing
Carousel with hiddent Dots indicator
1 / 4
Aurora
This is Aurora and it's fantastic
2 / 4
Beautiful Mountain
This is a Beautiful Mountain and it's gorgeous
3 / 4
Forest In The Valley
This is a Forest In The Valley and it's beautiful
4 / 4
Road Among The Mountains
This is a Road Among The Mountains and it's amazing
Carousel Public API
1 / 4
Aurora
This is Aurora and it's fantastic
2 / 4
Beautiful Mountain
This is a Beautiful Mountain and it's gorgeous
3 / 4
Forest In The Valley
This is a Forest In The Valley and it's beautiful
4 / 4
Road Among The Mountains
This is a Road Among The Mountains and it's amazing
AutoPlay Carousel
1 / 4
Aurora
This is Aurora and it's fantastic
2 / 4
Beautiful Mountain
This is a Beautiful Mountain and it's gorgeous
3 / 4
Forest In The Valley
This is a Forest In The Valley and it's beautiful
4 / 4
Road Among The Mountains
This is a Road Among The Mountains and it's amazing
Advanced Carousel
1
2
3
4
5
6
7
8
9
RTL Carousel
یک
دو
سه
چهار
پنج
شیش
هفت
هشت
نه

Implementation

BitCarousel parameters
Name
Type
Default value
Description
InfiniteScrolling bool false If enabled the carousel items will navigate in an infinite loop (first item comes after last item and last item comes before first item).
ChildContent RenderFragment? null Items of the carousel.
ShowDots bool true Shows or hides the Dots indicator at the bottom of the BitCarousel.
ShowNextPrev bool true Shows or hides the Next/Prev buttons of the BitCarousel.
VisibleItemsCount int 1 Number of items that is visible in the carousel
ScrollItemsCount int 1 Number of items that is going to be changed on navigation
AutoPlay bool false Enables/disables the auto scrolling of the slides.
AutoPlayInterval double 2000 Sets the interval of the auto scrolling in milliseconds (the default value is 2000).
AnimationDuration double 0.5 Sets the duration of the scrolling animation in seconds (the default value is 0.5).
Direction BitDirection BitDirection.LeftToRight Sets the direction of the scrolling (the default value is LeftToRight).
OnChange EventCallback<int> The event that will be called on carousel page navigation.
BitComponentBase parameters
Name
Type
Default value
Description
AriaLabel string? null The aria-label of the control for the benefit of screen readers.
Class string? null Custom CSS class for the root element of the component.
HtmlAttributes Dictionary<string, object> new Dictionary<string, object>() Capture and render additional attributes in addition to the component's parameters.
Id string? null Custom id attribute for the root element. if null the UniqueId will be used instead.
IsEnabled bool true Whether or not the component is enabled.
Style string? null Custom CSS style for the root element of the component.
Visibility BitVisibility BitVisibility.Visible Whether the component is visible, hidden or collapsed.
BitComponentBase public members
Name
Type
Default value
Description
UniqueId Guid Guid.NewGuid() The readonly unique id of the root element. it will be assigned to a new Guid at component instance construction.
RootElement ElementReference The ElementReference of the root element.
BitDirection enum
Name
Value
Description
LeftToRight 0 Renders content from left to right.
RightToLeft 1 Renders content from right to left.
BitVisibility enum
Name
Value
Description
Visible 0 The content of the component is visible.
Hidden 1 The content of the component is hidden, but the space it takes on the page remains (visibility:hidden).
Collapsed 2 The component is hidden (display:none).