Fibbl Carousel

A carousel element to show images.

This is an expandable element. Read how it handles its styles in the Expandable elements section.

Code example

html

<script
    src="https://cdn.fibbl.com/fibbl.js"
    type="module"
></script>
<fibbl-carousel
    data-product-id="@demo-shoe"
    style="width: 300px; height: 300px"
></fibbl-carousel>

Custom attributes:

data-product-id - a unique id of product in Fibbl's databases.
data-controls - a list of controls (e.g. expand button). Possible values expand, none. The default is expand.
data-mode - a current mode of the element, either full or poster (render only one image). The default is poster.

Live demo

See the Pen fibbl-carousel by Fibbl (@Fibbl) on CodePen.