Hoppa till innehållet
CONTENT · FREE

Carousel

Presentera höjdpunkter som bildspel, med kontroller som folk kan pausa.

Presentera höjdpunkter som bildspel med föregående- och nästa-knappar och indikatorer; automatisk uppspelning är valfri och användare kan pausa den.

Varför det hjälper

  • Föregående och nästa
  • Valfri automatisk uppspelning
  • Pausreglage

Var det passar

  • Kampanjer
  • Produktbilder
  • Meddelanden
Kontrollen Carousel på en RayCraft-sida

Exempel

<Carousel Label="Highlights" @bind-ActiveIndex="_index">
    <CarouselSlide><h3>Flat design</h3><p>Square corners and sober colors in both themes.</p></CarouselSlide>
    <CarouselSlide><h3>Accessible</h3><p>Keyboard support and WCAG contrast.</p></CarouselSlide>
    <CarouselSlide><h3>Localized</h3><p>English and Bulgarian built in.</p></CarouselSlide>
</Carousel>
<Carousel Label="Auto-advancing" AutoplayInterval="4000">
    <CarouselSlide>First (changes every 4 s; pauses on hover, focus or with the pause button)</CarouselSlide>
    <CarouselSlide>Second</CarouselSlide>
    <CarouselSlide>Third</CarouselSlide>
</Carousel>
<span>Slide index: @_index</span>

@code {
    private int _index;
}

Ett kort utdrag. Lägg till @using RayCraft.Blazor.Components på din sida och använd ett interaktivt renderingsläge.

Ingår i RayCraft Free. Fungerande exempel finns i GitHub-arkiv (MIT); det innehåller exempel- och demokod, inte bibliotekets kod.

Alla kontroller ยท Dokumentation