Les carrousels en CSS / HTML et JS sont souvent utilisés comme des éléments de qualité pour l'expérience utilisateur (UX) dans la conception Web moderne.
Ils permettent une mise en valeur qualitative des contenus, tels que des photos, des vidéos ou autres (menu, liens, etc...). Si vous recherchez un carrousel qualitatif pour épater vos visiteurs, cette liste de carrousel facile à mettre en place vous aideront.Vous retrouverez grâce à CodePen directement le code HTML5 / CSS3 ou SCSS + JS à modifier à votre convenance pour votre site afin de personnaliser au mieux votre site.
See the Pen 3D Carousel: navigation by Giulio Mainardi (@mgiulio) on CodePen.dark
Ce carrousel permet une navigation en 3 dimensions de chacun des éléments, il est possible d'en ajouter ou d'en retirer à votre convenance. Des boutons de navigation sont intégrés pour faciliter celle-ci et ne pas avoir à passer sur les visuels. Ce module carousel en 3D peut être parfaitement adapté à la conception de votre site Web ou Application.
See the Pen Infinite Automatic Carousel by Julien Lejeune (@jlnljn) on CodePen.dark
Un carrousel automatique plutôt orienté "Slider" au final, contient un fading linéaire à l'horizontal et un timer, il pourra s'adapter très bien dans vos pages, votre site Web ou votre application.
See the Pen Hover-Carousel by Yair Even Or (@vsync) on CodePen.dark
Un Carrousel qui a pour particularité de slide en même temps que vous passez dessus. Très esthétique et pratique pour une UX travaillée.
See the Pen Carousel by DobladoV (@dobladov) on CodePen.dark
Un carrousel qui donne un effet finder de Mac OS en mode image. Adaptable en HTML / CSS3 et JS . Plutôt facile à intégrer et modifier.
See the Pen Looping Instagram Feed Carousel by Ryan Mulligan (@hexagoncircle) on CodePen.dark
Connectez votre librairie Instagram directement sur ce Carrousel, la modification est assez simple dans le JS. Vous pourrez l'adapter et l'intégrer sur votre site facilement.
[oxygen-template id="252569"]
See the Pen Carousel team by Marco Barría (@fixcl) on CodePen.dark
Un carrousel light, avec la possibilité de modifier le nombre de slide à afficher (nView=3) ainsi qu'une automatisation à 2,5secondes.
See the Pen 3d carousel 3 by Juan C. Irizar (@carliirizar) on CodePen.dark
Un format waterwheel qui replacera indéfiniment les slides en back dans la chaine de présentation. Carrousel fluide et intégrable sur votre site de façon clair et simple.
See the Pen CSS Carousel with keyboard controls by David Lewis (@dp_lewis) on CodePen.dark
Un carrousel / slider étonnant qui peut être piloté par des flèches ou très simplement au clavier, il intègre un background en mode cover et la possibilité d'ajouter tous les contenus que vous souhaitez.