ajout infos Sliders / Carousels

Author: ms-studio

20-manipulation.md

@@ -120,7 +120,7 @@ innerHTML | contenu littéral html du noeud
 
 Navigation dans l'arbre DOM
 
-![Navigation DOM](/cours-javascript/img/DOM-navigation.jpg)
+![Navigation DOM](img/DOM-navigation.jpg)
 
 **Méthodes d'un nœud:**
 

65-lightbox.md

@@ -25,3 +25,21 @@ Voir aussi:
 - Le site CSS Script présente [de nombreuses librairies](https://www.cssscript.com/tag/lightbox/).
 - Un [tutoriel pour créer une lightbox](https://medium.com/@diegovogel/create-a-lightbox-gallery-with-standard-bootstrap-components-b9de322ddb9e) avec les composants standard de Bootstrap.
 
+## Swipers, Sliders, Slideshows et carousels
+
+Une autre manière de présenter une gallerie d'images, sans ouverture de fenêtre modale, est le concept du "slideshow" ou "carousel". 
+
+![présentation en mode carousel](img/carousel-images.jpg)
+
+Exemples:
+
+- [Code pour Slideshow / Carousel](https://www.w3schools.com/howto/howto_js_slideshow.asp) sur W3Schools
+- [Un exemple codepen](https://codepen.io/dfitzy/pen/xZqGVo) par David Fitas
+- [Un exemple codepen](https://codepen.io/AMKohn/pen/EKJHf) en pur CSS (sans JS) par Avi Kohn
+
+Librairies complètes:
+
+- [TinySwiper](https://tiny-swiper.js.org/docs/demo/). Taille JS: 16 Ko.
+- [Splide JS](https://splidejs.com/) par Naotoshi Fujita. Taille JS: 45 Ko.
+- [Flickity](https://flickity.metafizzy.co) par Metafizzy (2015-2021). Taille JS: 61 Ko.
+- [Swiper](https://swiperjs.com/) par Vladimir Kharlampidi (2014-2021). Taille JS: 139 Ko.