Karruseller, også kendt som billedslidere, er interaktive elementer, der bruges til at vise en række billeder eller indholdselementer, som roterer. De anvendes ofte til at vise produkter, porteføljeelementer eller fremhævet indhold.

Nøglefunktioner

Bootstraps karruselkomponent er et effektivt værktøj til at skabe engagerende brugeroplevelser. Den tilbyder automatisk cykling, navigationskontroller og tilpasningsmuligheder for overgangseffekter, timing og indikatorer.

Anvendelsesklasser

• carousel: Denne klasse anvendes på container-elementet for karrusellen;
• carousel-inner: Denne klasse anvendes på et <div>-element inde i containeren. Den omslutter alle karruselelementer (slides) og definerer det indre indhold af karrusellen;
• carousel-item: Denne klasse anvendes på individuelle slides i karrusellen. Hver carousel-item repræsenterer én slide i karrusellen;
• active: Denne klasse markerer en slide som aktiv eller den aktuelt viste slide. Den sikrer, at den tilsvarende slide er synlig, når karrusellen vises;
• carousel-control-prev og carousel-control-next: Disse klasser anvendes på forrige og næste navigationsknapper. De giver brugeren mulighed for manuelt at navigere gennem karrusellen;
• data-bs-target og data-bs-slide: Disse attributter bruges sammen med navigationsknapperne til at angive den målrettede karrusel og retningen for slide-overgange;
• carousel-indicators: Denne klasse anvendes på en liste af indikator-elementer (normalt <li>-elementer), der repræsenterer hver karruselslide;
• data-bs-interval og data-bs-pause: Disse attributter konfigurerer intervallet (i millisekunder) mellem slide-overgange og angiver, om karrusellen skal pauses ved hover eller fokus.