Slider
Default swiper slider
Use the.active
class and images to prevent browser default image alignment.
With Controls
Use the.active
class and images to prevent browser default image alignment.
With Indicators
Use the.carousel-indicators
through carousel indicates.
With Captions
Add captions to your slides easily with the.carousel-caption
element within any .carousel-item.
Cross-Fade
Add.carousel-fade
to your carousel to animate slides with a fade transition instead of a slide.you may want to add .bg-body or some custom CSS to the .carousel-items for proper cross-fading.
Individual Carousel-Item Interval
Adddata-bs-interval
to a .carousel-item to change the amount of time to delay between automatically cycling to the next item.
Disable Touch Swiping
Use thedata-bs-touch
Carousels support swiping left/right on touchscreen devices to move between slides. This can be disabled using the attribute.
Dark Variant
Add.carousel-dark
to the .carousel for darker controls, indicators, and captions.