カルーセルは、スライドを1列に並べて表示します。この列はスクロールしてスライドごとにスナップし、スワイプ、トラックパッド、矢印キーでネイティブに動くほか、前へ・次へのボタンやドットでも移動できます。各スライドには nuiCarouselSlide を付け、そのタイトルで名前を付けます。

perView で、一度に表示するスライドを1枚にするか複数枚にするかを決めます。perView="auto" なら、各スライドは自身の幅を保ちます。[(index)] は表示中の最初のスライドをバインドし、loop を指定すると最後から最初に戻ります。

autoplay を指定すると自動再生ボタンが付き、スライドが自動で切り替わります。自動再生はポインターを重ねている間は一時停止し、キーボードフォーカスが入ると、WAI-ARIA のパターンに従って完全に停止します。

6秒ごとに次のスライドに切り替わり、自動再生ボタンのリングがそれまでの時間に合わせて満ちていきます。ポインターを重ねると自動再生が一時停止し、Tab キーでフォーカスを移すと停止します。

カードを並べた棚

perView="auto" は各カードの幅を保ち、収まるだけのカードを表示します。ドットはスワイプに追従し、[(index)] で現在の位置がわかります。

First in view: Linen shirt