Flowbite Svelte: v0.46.14
Svelte: v5.0.0-next.179
SvelteKit: v2.5.18
Vite: v5.3.3
Carousel
The carousel component can be used to cycle through a set of elements using custom options, controls, and indicators.Default Carousel
Set the `duration` prop to define the time interval for chaning images. Time is set in miliseconds. The default value for `duration` is set to zero that means no autochange of images. In that case you can control which image is displayed by the `index` prop.
Controls
Use the internal `Controls` component to listen to click events which will trigger the slide event from the carousel component to each direction. You can customize the control elements with the `class` property.Indicators
Show the carousel indicators by adding the internal `Indicators` component.Thumbnails
You can control the `Carousel` component externally by the `index` prop. Here is an example how to use the `Thumbnails` component to achieve that.Caption
The `Carousel` exposes the `change` event containing info about the currently displayed image. You can use it to build custom caption for the carousel.Carousel with links
You can use `slot="slide"` and internal component `Slide` to control the image display. Here's an example how to wrap images with the anchor element.Customization
Basic customization
Advanced customization
Custom Carousel transition