The Carousel allows the user to browse through a set of items.
The component is mostly used for showing a gallery of images, but can hold any other HTML element.
There are several ways to perform navigation:
on desktop - the user can navigate using the navigation arrows or with keyboard shorcuts.
This component provides a build in fast navigation group which can be used via [F6] / [Shift] + [F6] / [Ctrl] + [Alt/Option] / [Down] or [Ctrl] + [Alt/Option] + [Up].
In order to use this functionality, you need to import the following module:
Defines the visibility of the navigation arrows. If set to true the navigation arrows will be hidden. Note: The navigation arrows are never displayed on touch devices. In this case, the user can swipe to navigate through the items.
Defines the style of the page indicator. Available options are: - Default - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y) - Numeric - The page indicator will display the current page and the total number of pages. (e.g. X of Y)
Defines the position of arrows. Available options are: - Content - the arrows are placed on the sides of the current page. - Navigation - the arrows are placed on the sides of the page indicator.
Fired whenever the page changes due to user interaction, when the user clicks on the navigation arrows or while resizing, based on the items-per-page-l, items-per-page-m and items-per-page-s properties.
When the last page is reached, pressing "Forward" will navigate to the start.
When the first page is reached, pressing "Backward" will navigate to the last page.
When pageIndicatorStyle is set to "Content", the arrows are placed on the sides of the current page.
When pageIndicatorStyle is set to "Navigation", the arrows are placed on the sides of the page indicator.