Pour cette partie, la librairie Swiper sera utilisée afin de créer un carrousel permettant d’afficher les différents albums du groupe dans le héros de votre page.
Aperçu du résultat 👇
Requis
Retirez l'élément <picture> de votre héros et insérez à sa place un carrousel Swiper. Faites en sorte que ce carrousel prenne toute la largeur et hauteur du héros, qu'il soit affiché derrière votre dégradé de couleur et votre contenu texte.
Dans chacune des slides du carrousel, insérez une image d'une pochette d'album du groupe. Cette image doit afficher de façon identique à l'ancienne. C'est à dire utiliser object-fit afin d'être entièrement visible et d'aucune façon tronqué.
Vous devez en ajouter minimalement quatre albums.
N'hésitez pas à dépasser le nombre minimal. Plus il y aura d'albums, plus votre héros sera riche visuellement.
Puisque votre carrousel se trouve derrière d'autres éléments (dégradé et textes), il est impossible d'y accéder afin de changer manuellement la slide affichée. Vous devez donc faire en sorte que votre carrousel change de slide automatiquement à toute les 2 secondes.
Votre carrousel doit être vertical et tourner en boucle à l'infini. Vous devez aussi choisir un effet de transition parmi celles-ci: fade, cube, coverflow, flip.