Carousel

Cette composante permet d'instancier un carousel sur un élément html.

Dépendance

Swiper

Afin d'utiliser cette composante, vous devrez vous assurer que la dépendance npm swiper soit installée dans votre projet.

Si vous n'êtes pas dans la structure NPM ou TimTools, référez-vous à la documentation ci-dessous.

Comment l'utiliser

Afin d'utiliser la composante, mettre l'attribut data-component="Carousel" sur une structure html respectant celle de la librairie Swiper.

Pour que les styles soient bien appliqués, il faut importer les styles de bases de Swiper ainsi que les modules supportés (navigation et pagination).

Paramètres

Les paramètres permettent d'ajuster des options précises afin de personaliser davantage le comportement du carousel.

SPLIT

Ce paramètre permet d'avoir 2 diapositives du carousel visible en simultanné sur grand écran (768px et plus), mais seulement une diapositive sur écran plus petit (767px et moins).

AUTOPLAY

Ce paramètre vous permet de faire défiler automatiquement le carousel.

LOOP

Ce paramètre vous permet de faire défiler à l'infini le carousel.

SLIDES

Ce paramètre vous permet de déterminer combien de diapositives seront visibles en même temps. (ex.: afin de voir 2.5 diapositives à la fois).