Carousel

Carousel is a custom component to display content in a rotating manner

Import


import {{'{'}}CAROUSEL_PROVIDERS{{'}'}} from 'fuel-ui/fuel-ui';

Getting Started

Carousel is a custom element to display a slideshow of cycling elements

Swipe left and swipe right events are supported if hammerjs has been included.

Usage


<carousel>
    <div class="carousel-item">
        <img src="image1.jpg" class="carousel-item" />
    </div>
    <div class="carousel-item">
        <img src="image2.jpg" class="carousel-item" />
    </div>
    <div class="carousel-item">
        <img src="image3.jpg" class="carousel-item" />
    </div>
</carousel>


<carousel>
    <div class="carousel-item">
        <img src="image1.jpg" />
        <div class="carousel-caption">
            <h3>Some Title 1</h3>
            <p>Some caption 1</p>
        </div>
    </div>
    <div class="carousel-item">
        <img src="image2.jpg" />
        <div class="carousel-caption">
            <h3>Some Title 2</h3>
            <p>Some caption 2</p>
        </div>
    </div>
</carousel>

Attributes

Loading table...