Carousel

Additional options for the slideshow component for cycling through elements—images or slides of text—like a carousel.

Indicators

Set @otherprops="indicators(round)" to add rounded indicators to the carousel, alongside the previous/next controls. The indicators let users jump directly to a particular slide.

<ol outputclass="carousel" otherprops="indicators(round)">
  <li>
    <image href="..." />
  </li>
  <li>
    <image href="..." />
  </li>
  <li>
    <image href="..." />
  </li>
</ol>

With captions

Add captions by using <fig> elements

<ol outputclass="carousel" otherprops="indicators(round)">
  <li>
    <fig>
      <title outputclass="carousel-caption-readable">The First Slide</title>
      <image href="..." />
    </fig>
  </li>
  <li>
    <fig>
      <title outputclass="carousel-caption-readable">The Second Slide</title>
      <image href="..." />
    </fig>
  </li>
  <li>
    <fig>
      <title outputclass="carousel-caption-readable">The Third Slide</title>
      <image href="..." />
    </fig>
  </li>
</ol>