{"id":1219,"date":"2026-10-14T22:02:20","date_gmt":"2026-10-14T22:02:20","guid":{"rendered":"https:\/\/yovobassy.com\/?page_id=1219"},"modified":"2026-10-23T01:53:32","modified_gmt":"2026-10-23T01:53:32","slug":"yovo-friends","status":"publish","type":"page","link":"https:\/\/yovobassy.com\/index.php\/yovo-friends\/","title":{"rendered":"Yovo &amp; Friends"},"content":{"rendered":"\n<!-- ==========================================\n YOVO & FRIENDS \u2014 COVERFLOW 3D\n WORDPRESS BLOCKSY\n\n VERSION COMPL\u00c8TE \u2014 57 PHOTOGRAPHIES\n\n MISE EN PAGE ORIGINALE CONSERV\u00c9E\n CADRES ADAPTATIFS\n COVERFLOW 3D\n FL\u00c8CHES GALERIE\n FL\u00c8CHES ORANGE EN PLEIN \u00c9CRAN\n COMPTEUR 01 \/ 57\n LECTURE AUTOMATIQUE\n RETOUR AU D\u00c9BUT\n NAVIGATION TACTILE\n\n FOND : #101010\n ORANGE : #F4A425\n BLANC : #FFFFFF\n ========================================== -->\n\n<style>\n\n\/* FOND WORDPRESS BLOCKSY *\/\n\nbody.page:has(#yovo-friends-coverflow),\nbody.page:has(#yovo-friends-coverflow) #main,\nbody.page:has(#yovo-friends-coverflow) .site-main,\nbody.page:has(#yovo-friends-coverflow) .site-content,\nbody.page:has(#yovo-friends-coverflow) .ct-container,\nbody.page:has(#yovo-friends-coverflow) .entry-content,\nbody.page:has(#yovo-friends-coverflow) article,\nbody.page:has(#yovo-friends-coverflow) .entry-content > * {\n  background-color: #101010 !important;\n}\n\n\/* SUPPRIMER SIDEBAR *\/\n\nbody.page:has(#yovo-friends-coverflow) #sidebar,\nbody.page:has(#yovo-friends-coverflow) .ct-sidebar {\n  display: none !important;\n}\n\n\/* LARGEUR *\/\n\nbody.page:has(#yovo-friends-coverflow) #main > .ct-container,\nbody.page:has(#yovo-friends-coverflow) .site-main > .ct-container {\n  display: block !important;\n  width: 100% !important;\n  max-width: 1400px !important;\n  margin: 0 auto !important;\n}\n\n\/* FONDS TRANSPARENTS *\/\n\nbody.page:has(#yovo-friends-coverflow) .entry-content,\nbody.page:has(#yovo-friends-coverflow) .entry-content > .wp-block-group {\n  background-color: transparent !important;\n}\n\nbody.page:has(#yovo-friends-coverflow) .entry-title {\n  color: #FFFFFF !important;\n}\n\n\/* STRUCTURE *\/\n\n#yovo-friends-coverflow,\n#yovo-friends-coverflow * {\n  box-sizing: border-box;\n}\n\n#yovo-friends-coverflow {\n  --orange: #F4A425;\n\n  background: #101010;\n  color: #FFFFFF;\n  font-family: Arial, sans-serif;\n\n  width: 100%;\n  height: auto;\n  padding: 5px 12px 12px;\n\n  overflow: hidden;\n}\n\n\/* TITRE *\/\n\n#yovo-friends-coverflow .yv-title {\n  font-size: 20px !important;\n  line-height: 1.25 !important;\n  font-weight: 700 !important;\n\n  max-width: 1100px;\n  margin: 0 auto 12px !important;\n\n  color: #FFFFFF;\n  text-transform: uppercase;\n}\n\n#yovo-friends-coverflow .yv-orange {\n  color: #F4A425 !important;\n}\n\n#yovo-friends-coverflow .yv-white {\n  color: #FFFFFF !important;\n}\n\n#yovo-friends-coverflow .yv-line {\n  display: block;\n  width: 65px;\n  height: 3px;\n  background: #F4A425;\n  margin-top: 12px;\n}\n\n\/* SC\u00c8NE COVERFLOW *\/\n\n#yovo-friends-coverflow .yv-stage {\n  position: relative;\n\n  width: 100%;\n  height: clamp(230px, 32vw, 340px) !important;\n  max-width: 1100px;\n\n  margin: 0 auto 5px !important;\n\n  perspective: 1400px;\n  overflow: hidden;\n  touch-action: pan-y;\n}\n\n\/* CADRES PHOTO *\/\n\n#yovo-friends-coverflow .yv-card {\n  position: absolute;\n\n  left: 50%;\n  top: 50%;\n\n  width: 54%;\n  height: 82%;\n  max-width: 550px;\n\n  margin: 0;\n  padding: 0;\n\n  background: #1b1b1b;\n\n  border: 2px solid #444;\n  border-radius: 9px;\n\n  overflow: hidden;\n  cursor: pointer;\n\n  transform-style: preserve-3d;\n\n  transition:\n    transform .55s ease,\n    opacity .55s ease,\n    box-shadow .55s ease;\n\n  box-shadow: 0 15px 40px #000;\n}\n\n\/* PHOTO ACTIVE *\/\n\n#yovo-friends-coverflow .yv-card.active {\n  border-color: #F4A425;\n  cursor: zoom-in;\n\n  box-shadow:\n    0 0 30px #F4A42544,\n    0 20px 45px #000;\n}\n\n\/* PHOTOS ENTI\u00c8RES *\/\n\n#yovo-friends-coverflow .yv-card img {\n  display: block !important;\n\n  width: 100% !important;\n  height: 100% !important;\n\n  max-width: 100% !important;\n  max-height: 100% !important;\n\n  object-fit: contain !important;\n  object-position: center center !important;\n\n  background: #181818;\n}\n\n\/* FL\u00c8CHES GALERIE *\/\n\n#yovo-friends-coverflow .yv-controls {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  gap: 25px;\n  margin-top: 5px !important;\n  margin-bottom: 0 !important;\n}\n\n#yovo-friends-coverflow .yv-arrow {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  width: 43px;\n  height: 43px;\n  padding: 0;\n\n  background: #111111;\n  color: #F4A425;\n\n  border: 2px solid #F4A425;\n  border-radius: 50%;\n\n  font-size: 29px;\n  cursor: pointer;\n}\n\n#yovo-friends-coverflow .yv-arrow:hover {\n  background: #F4A425;\n  color: #101010;\n}\n\n\/* NOM ET COMPTEUR *\/\n\n#yovo-friends-coverflow .yv-info {\n  min-width: 150px;\n  text-align: center;\n}\n\n#yovo-friends-coverflow .yv-name {\n  color: #FFFFFF;\n  font-weight: bold;\n  font-size: 14px;\n}\n\n#yovo-friends-coverflow .yv-counter {\n  color: #F4A425;\n  font-size: 12px;\n  margin-top: 8px;\n  font-variant-numeric: tabular-nums;\n}\n\n\/* POINTS *\/\n\n#yovo-friends-coverflow .yv-dots {\n  display: flex;\n  justify-content: center;\n  flex-wrap: wrap;\n\n  gap: 8px;\n  margin: 12px 0 !important;\n}\n\n#yovo-friends-coverflow .yv-dot {\n  padding: 0;\n\n  width: 8px;\n  height: 8px;\n\n  border: 0;\n  border-radius: 20px;\n  background: #666666;\n\n  cursor: pointer;\n}\n\n#yovo-friends-coverflow .yv-dot.active {\n  background: #F4A425;\n  width: 25px;\n}\n\n\/* BOUTONS DU BAS *\/\n\n#yovo-friends-coverflow .yv-actions {\n  display: flex !important;\n  justify-content: center !important;\n  align-items: center !important;\n  flex-wrap: wrap !important;\n\n  gap: 12px !important;\n  margin: 0 !important;\n  padding: 0 !important;\n}\n\n#yovo-friends-coverflow .yv-action {\n  flex: 0 0 auto !important;\n\n  width: auto !important;\n  min-width: 0 !important;\n  max-width: none !important;\n\n  height: auto !important;\n  min-height: 0 !important;\n\n  padding: 12px 17px !important;\n\n  background: #101010 !important;\n  color: #F4A425 !important;\n\n  border: 1px solid #F4A425 !important;\n  border-radius: 7px !important;\n\n  font-family: Arial, sans-serif !important;\n  font-size: 12px !important;\n  font-weight: 700 !important;\n  line-height: 1.2 !important;\n\n  box-shadow: none !important;\n  cursor: pointer !important;\n}\n\n#yovo-friends-coverflow .yv-action:hover {\n  background: #F4A425 !important;\n  color: #101010 !important;\n}\n\n\/* TRIANGLE PLAY *\/\n\n#yovo-friends-coverflow .yv-play-icon {\n  display: inline-block;\n\n  width: 0;\n  height: 0;\n\n  margin-right: 6px;\n  vertical-align: middle;\n\n  border-top: 6px solid transparent;\n  border-bottom: 6px solid transparent;\n  border-left: 10px solid #F4A425;\n}\n\n#yovo-friends-coverflow .yv-playing .yv-play-icon {\n  display: none;\n}\n\n#yovo-friends-coverflow .yv-auto:hover .yv-play-icon {\n  border-left-color: #101010;\n}\n\n\/* TEXTE D'AIDE *\/\n\n#yovo-friends-coverflow .yv-help {\n  color: #999999;\n  font-size: 12px;\n  text-align: center;\n\n  margin-top: 10px !important;\n  margin-bottom: 0 !important;\n}\n\n\/* ==========================================\n   PLEIN \u00c9CRAN\n   ========================================== *\/\n\n#yovo-friends-coverflow .yv-lightbox {\n  display: none;\n\n  position: fixed !important;\n  inset: 0 !important;\n\n  width: 100vw !important;\n  height: 100vh !important;\n  height: 100dvh !important;\n\n  z-index: 2147483647 !important;\n\n  background: rgba(0,0,0,.98) !important;\n\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n\n  padding: 55px 12px 45px !important;\n}\n\n#yovo-friends-coverflow .yv-lightbox.open {\n  display: flex !important;\n}\n\n#yovo-friends-coverflow .yv-large {\n  display: block !important;\n\n  width: auto !important;\n  height: auto !important;\n\n  max-width: calc(100vw - 112px) !important;\n  max-height: 78vh !important;\n  max-height: 78dvh !important;\n\n  object-fit: contain !important;\n\n  border: 2px solid #F4A425 !important;\n  border-radius: 5px !important;\n\n  box-shadow: 0 0 35px #F4A4252E !important;\n}\n\n\/* ==========================================\n   NOUVELLES FL\u00c8CHES ORANGE PLEIN \u00c9CRAN\n   ========================================== *\/\n\n#yovo-friends-coverflow .yv-zoom-arrow {\n  position: fixed !important;\n  top: 50% !important;\n\n  transform: translateY(-50%) !important;\n  z-index: 2147483647 !important;\n\n  display: flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n\n  width: 48px !important;\n  height: 48px !important;\n  padding: 0 !important;\n\n  border: 2px solid #F4A425 !important;\n  border-radius: 50% !important;\n\n  background: rgba(16,16,16,.9) !important;\n  color: #F4A425 !important;\n\n  font-size: 32px !important;\n  line-height: 1 !important;\n\n  cursor: pointer !important;\n}\n\n#yovo-friends-coverflow .yv-zoom-prev {\n  left: 15px !important;\n}\n\n#yovo-friends-coverflow .yv-zoom-next {\n  right: 15px !important;\n}\n\n#yovo-friends-coverflow .yv-zoom-arrow:hover {\n  background: #F4A425 !important;\n  color: #101010 !important;\n}\n\n\/* CROIX DE FERMETURE *\/\n\n#yovo-friends-coverflow .yv-close {\n  position: absolute !important;\n\n  top: 15px !important;\n  right: 20px !important;\n\n  width: 45px !important;\n  height: 45px !important;\n  padding: 0 !important;\n\n  background: #101010 !important;\n  color: #F4A425 !important;\n\n  border: 2px solid #F4A425 !important;\n  border-radius: 50% !important;\n\n  font-size: 32px !important;\n  line-height: 1 !important;\n\n  cursor: pointer !important;\n  z-index: 20 !important;\n}\n\n\/* TITRE EN PLEIN \u00c9CRAN *\/\n\n#yovo-friends-coverflow .yv-lightbox-title {\n  color: #FFFFFF !important;\n  font-family: Arial, sans-serif !important;\n  font-size: 15px !important;\n\n  margin-top: 15px !important;\n  text-align: center !important;\n}\n\n#yovo-friends-coverflow .yv-light-counter {\n  color: #F4A425;\n  font-size: 12px;\n  margin-top: 5px;\n}\n\n\/* RESPONSIVE *\/\n\n@media(max-width:768px) {\n\n  body.page:has(#yovo-friends-coverflow) #main > .ct-container {\n    width: 100% !important;\n    padding-left: 12px !important;\n    padding-right: 12px !important;\n  }\n\n  #yovo-friends-coverflow .yv-stage {\n    height: clamp(220px, 60vw, 300px) !important;\n  }\n\n  #yovo-friends-coverflow .yv-actions {\n    gap: 8px !important;\n  }\n\n  #yovo-friends-coverflow .yv-action {\n    font-size: 11px !important;\n    padding: 9px 12px !important;\n  }\n\n  #yovo-friends-coverflow .yv-zoom-arrow {\n    width: 37px !important;\n    height: 37px !important;\n    font-size: 26px !important;\n  }\n\n  #yovo-friends-coverflow .yv-zoom-prev {\n    left: 4px !important;\n  }\n\n  #yovo-friends-coverflow .yv-zoom-next {\n    right: 4px !important;\n  }\n\n  #yovo-friends-coverflow .yv-large {\n    max-width: calc(100vw - 86px) !important;\n    max-height: 76dvh !important;\n  }\n\n  #yovo-friends-coverflow .yv-close {\n    top: 12px !important;\n    right: 12px !important;\n    width: 40px !important;\n    height: 40px !important;\n  }\n\n}\n\n@media(max-width:600px) {\n\n  #yovo-friends-coverflow .yv-controls {\n    gap: 14px;\n  }\n\n  #yovo-friends-coverflow .yv-arrow {\n    width: 37px;\n    height: 37px;\n  }\n\n}\n\n@media(prefers-reduced-motion:reduce) {\n  #yovo-friends-coverflow .yv-card {\n    transition: none;\n  }\n}\n\n<\/style>\n\n\n<!-- ==========================================\n     STRUCTURE HTML\n     ========================================== -->\n\n<div id=\"yovo-friends-coverflow\">\n\n  <!-- TITRE -->\n\n  <h2 class=\"yv-title\">\n    <span class=\"yv-orange\">YOVO<\/span>\n    <span class=\"yv-white\">&amp; FRIENDS<\/span>\n    <span class=\"yv-line\"><\/span>\n  <\/h2>\n\n\n  \n<!-- ======================================\n     YOVO & FRIENDS\n     GALERIE \u2014 61 PHOTOS\n     NUM\u00c9ROTATION CORRIG\u00c9E : 01 \u00c0 61\n     ORDRE ORIGINAL CONSERV\u00c9\n     ====================================== -->\n\n<div class=\"yv-stage\" aria-label=\"Galerie photographique Yovo et Friends\">\n\n  <!-- PHOTO 01 \u2014 N\u00c8G'MARRONS CIGALE 2023 -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; N\u00e8g\u2019Marrons Cigale 2023\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_2742-1.jpeg\" alt=\"Yovo et N\u00e8g'Marrons \u00e0 La Cigale en 2023\" loading=\"eager\">\n  <\/button>\n\n  <!-- PHOTO 02 \u2014 LA FOUINE BOURGES 2011 -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; La Fouine - Bourges 2011\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Yovo-Bourges.jpeg\" alt=\"Yovo et La Fouine Bourges 2011\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 03 \u2014 JIMMY CLIFF -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Jimmy Cliff &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3487.jpeg\" alt=\"Yovo et Jimmy Cliff\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 04 \u2014 TYRONE DOWNIE -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Tyrone Downie &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Tyrone-Downie-Yovo.jpeg\" alt=\"Yovo et Tyrone Downie\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 05 \u2014 NNEKA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Nneka\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_0258.jpeg\" alt=\"Yovo et Nneka\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 06 \u2014 JEAN ALAIN ROUSSEL -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Papa Jean Alain Roussel\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Snapseed-scaled.jpeg\" alt=\"Yovo et Jean Alain Roussel\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 07 \u2014 PRINCESS ERIKA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Princess Erika\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_1149.jpeg\" alt=\"Yovo et Princess Erika\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 08 \u2014 TONTON DAVID -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Tonton David &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/CA214090-DF18-4254-836E-F011761D3218.png\" alt=\"Yovo et Tonton David\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 09 \u2014 LA FOUINE -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; La Fouine\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/79FDCA2C-BAD4-4A69-9821-38B97B658536.png\" alt=\"Yovo et La Fouine\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 10 \u2014 LYES ET RACHID TAHA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo, Lyes &amp; Rachid Taha\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_5680.jpeg\" alt=\"Yovo avec Lyes et Rachid Taha\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 11 \u2014 DJ LORD ISSA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Dj Lord Issa &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_4721.jpeg\" alt=\"Yovo et DJ Lord Issa\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 12 \u2014 SECTEUR \u00c4 -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Secteur \u00c4\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/e21fcf7d-d93b-4c7c-86e3-a14746c6c890.jpeg\" alt=\"Yovo et Secteur \u00c4\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 13 \u2014 JACKY ET BEN-J -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo, Jacky &amp; Ben-J\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Ben-JYovo-Jacky.jpeg\" alt=\"Yovo avec Jacky et Ben-J\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 14 \u2014 DAVE GREEN -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Dave \u00ab Fitzroy \u00bb Green &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_2999.jpeg\" alt=\"Yovo et Dave Green\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 15 \u2014 STEPHAN EICHER -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Stephan Eicher\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/A1F1C029-AA5D-4FE8-998E-3ED90CE2445F.png\" alt=\"Yovo et Stephan Eicher\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 16 \u2014 STEPHAN EICHER 2019 -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Stephan Eicher 2019\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_9244-scaled.jpeg\" alt=\"Yovo et Stephan Eicher 2019\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 17 \u2014 DAVE STEWART -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Dave Stewart\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_5086-scaled.jpeg\" alt=\"Yovo et Dave Stewart\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 18 \u2014 YANISS ODUA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Yaniss Odua\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/0580D869-1663-40D8-87CF-622A9D9078B0.png\" alt=\"Yovo et Yaniss Odua\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 19 \u2014 DADDY YOD -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Daddy Yod\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Daddy-Yod-Yovo-1.jpeg\" alt=\"Yovo et Daddy Yod\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 20 \u2014 DOC GYN\u00c9CO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Doc Gyn\u00e9co &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_4552.jpg\" alt=\"Yovo et Doc Gyn\u00e9co\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 21 \u2014 CES\u00c1RIA \u00c9VORA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo, Ces\u00e1ria \u00c9vora &amp; N\u00e8g'Marrons\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Cesaria-Evora-NegMarrons-Yovo.jpeg\" alt=\"Ces\u00e1ria \u00c9vora, N\u00e8g'Marrons et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 22 \u2014 DANIEL MAXO RICO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Riddim Squad 2023: Daniel, Maxo, Rico &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_1267-scaled.jpeg\" alt=\"Riddim Squad 2023: Daniel, Maxo, Rico et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 23 \u2014 CALOGERO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Calogero\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/84A29C52-380C-429E-BF88-7E503A8AEE11.png\" alt=\"Yovo et Calogero\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 24 \u2014 AKHENATON -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Akhenaton\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/890EB71E-C1AB-415D-9BD4-FCD67F537D94\" alt=\"Yovo et Akhenaton\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 25 \u2014 SHURIK'N -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Shurik'n\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/9D6FAD22-DDE1-4293-867F-BB8D35083E15.png\" alt=\"Yovo et Shurik'n\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 26 \u2014 GODWIN LOGIE -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Godwin Logie Studio Haxo 2013\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/589BDF66-DD7C-4276-A038-D28108D67133.png\" alt=\"Yovo et Godwin Logie au Studio Haxo en 2013\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 27 \u2014 SLY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Sly - Compass Point Studio\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/A2D6C992-E537-467A-9ADA-3971A35937FA.png\" alt=\"Yovo et Sly au Compass Point Studio\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 28 \u2014 ALPHA BLONDY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Alpha Blondy\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_1393-scaled.jpeg\" alt=\"Yovo et Alpha Blondy\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 29 \u2014 JULIAN MARLEY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo et Julian Marley\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Yovo-Julian-Marley-VJR.jpeg\" alt=\"Yovo et Julian Marley\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 30 \u2014 GIMS -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo et Gims\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/D5B2CCF1-FE45-43AA-9184-C261C730DA35.png\" alt=\"Yovo et Gims\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 31 \u2014 ELLI MEDEIROS -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Elli Medeiros\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/F9533A1B-61EF-4C9D-B506-ECC4C78B9EB0.png\" alt=\"Yovo et Elli Medeiros\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 32 \u2014 MINIST\u00c8RE A.M.E.R -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; le Minist\u00e8re A.M.E.R\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/E08F9874-6463-45F4-9442-A4E6CA07E015.png\" alt=\"Yovo et le Minist\u00e8re A.M.E.R\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 33 \u2014 MO KALAMITY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Mo Kalamity\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_6722-rotated.jpeg\" alt=\"Yovo et Mo Kalamity\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 34 \u2014 YOUSS OUPHA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Youssoupha\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_6975-rotated.jpeg\" alt=\"Yovo et Youssoupha\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 35 \u2014 JACKY BROWN -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Jacky Brown\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3312.jpeg\" alt=\"Yovo et Jacky Brown\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 36 \u2014 BEN-J -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Ben-J\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_0292.jpeg\" alt=\"Yovo et Ben-J\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 37 \u2014 PASSI -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Passi\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_1050.jpeg\" alt=\"Yovo et Passi\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 38 \u2014 STOMY BUGSY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Stomy Bugsy\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/F15A8DF2-E3B1-4F35-A4C0-D003C966C443.jpeg\" alt=\"Yovo et Stomy Bugsy\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 39 \u2014 LOUISY JOSEPH -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Louisy Joseph\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/1FC4C0B7-30A4-475C-99F7-55148826BD0D.png\" alt=\"Yovo et Louisy Joseph\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 40 \u2014 MANU DIBANGO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Manu Dibango\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_0811-scaled.jpeg\" alt=\"Yovo et Manu Dibango\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 41 \u2014 MAXO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Maxo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_4070.jpeg\" alt=\"Yovo et Maxo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 42 \u2014 NNEKA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Nneka\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_4777.jpeg\" alt=\"Yovo et Nneka\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 43 \u2014 JACKY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Jacky\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Jacky-Yovo-6.05.2013.jpeg\" alt=\"Yovo et Jacky\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 44 \u2014 PINO PALLADINO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Pino Palladino\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/94515A0E-0E5D-4E99-81BE-30A9A8DEA116.png\" alt=\"Yovo et Pino Palladino\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 45 \u2014 TAL ET JACKY BROWN -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Tall &amp; Jacky Brown\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/Yovo-Tal-Jacky-TUMA-2013.jpeg\" alt=\"Yovo avec Tal et Jacky Brown\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 46 \u2014 JACKY BROWN -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Jacky Brown\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/35573E68-56DB-47D7-AD37-362B7F6B2C03.png\" alt=\"Yovo et Jacky Brown\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 47 \u2014 GEORGIO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Georgio\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_8772-scaled.jpeg\" alt=\"Yovo et Georgio\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 48 \u2014 YOVO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Black M &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3248.jpeg\" alt=\"Yovo \u2014 Photo 48\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 49 \u2014 DADDY MORY -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Daddy Mory &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3241-scaled.jpeg\" alt=\"Daddy Mory et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 50 \u2014 PITT BACCARDI -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Pitt Baccardi\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_0952-scaled.jpeg\" alt=\"Yovo et Pitt Baccardi\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 51 \u2014 ADRIAN SHERWOOD -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Adrian Sherwood &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_8108_SnapseedCopy-scaled.jpeg\" alt=\"Adrian Sherwood et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 52 \u2014 ZAHO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Zaho &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/FullSizeRender-2-scaled.jpeg\" alt=\"Zaho et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 53 \u2014 BUTTON -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Button &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_8119_SnapseedCopy-scaled.jpeg\" alt=\"Button et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 54 \u2014 LINO -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; Lino\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_5839-scaled.jpeg\" alt=\"Yovo et Lino\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 55 \u2014 GKILL -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo &amp; GKill\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_1077.jpeg\" alt=\"Yovo et GKill\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 56 \u2014 KT GORIQUE -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"KTGorique &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/548BEF28-BA81-4656-B6BE-0B3C43B00427.png\" alt=\"KTGorique et Yovo en backstage\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 57 \u2014 VIOLON -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Violon &amp; Yovo\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3270.jpeg\" alt=\"Violon et Yovo\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 58 \u2014 RIDDIM SQUAD 2010 -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Riddim Squad 2010\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/89D7DBC9-4211-4F96-9B6E-CD6B4AA95191.png\" alt=\"Riddim Squad 2010\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 59 \u2014 IZO OLYMPIA -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Izo &amp; Yovo - Olympia\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3263.jpeg\" alt=\"Izo et Yovo \u00e0 l'Olympia\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 60 \u2014 RICO MOUGINS -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Rico &amp; Yovo - Mougins\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3317.jpeg\" alt=\"Rico et Yovo \u00e0 Mougins\" loading=\"lazy\">\n  <\/button>\n\n  <!-- PHOTO 61 \u2014 YOVO AGADIR -->\n  <button type=\"button\" class=\"yv-card\" data-title=\"Yovo Agadir\">\n    <img decoding=\"async\" src=\"https:\/\/yovobassy.com\/wp-content\/uploads\/2026\/10\/IMG_3320.jpeg\" alt=\"Yovo \u00e0 Agadir\" loading=\"lazy\">\n  <\/button>\n\n<\/div>\n\n<!-- FIN GALERIE \u2014 61 PHOTOS -->\n\n  <!-- ======================================\n       NAVIGATION ORIGINALE\n       ====================================== -->\n\n  <div class=\"yv-controls\">\n\n    <button type=\"button\" class=\"yv-arrow yv-prev\" aria-label=\"Photo pr\u00e9c\u00e9dente\">\u2039<\/button>\n\n    <div class=\"yv-info\">\n\n      <div class=\"yv-name\">\n        Yovo &amp; Friends\n      <\/div>\n\n      <div class=\"yv-counter\">\n        01 \/ 43\n      <\/div>\n\n    <\/div>\n\n    <button type=\"button\" class=\"yv-arrow yv-next\" aria-label=\"Photo suivante\">\u203a<\/button>\n\n  <\/div>\n\n\n  <!-- POINTS -->\n\n  <div class=\"yv-dots\"><\/div>\n\n\n  <!-- BOUTONS BAS -->\n\n  <div class=\"yv-actions\">\n\n    <button type=\"button\" class=\"yv-action yv-auto\">\n      <span class=\"yv-play-icon\" aria-hidden=\"true\"><\/span>Lecture automatique\n    <\/button>\n\n    <button type=\"button\" class=\"yv-action yv-reset\">\n      \u21ba Revenir au d\u00e9but\n    <\/button>\n\n  <\/div>\n\n\n  <!-- AIDE -->\n\n  <p class=\"yv-help\">\n    Faites glisser les photos pour naviguer.\n    Appuyez sur la photo centrale pour l&rsquo;agrandir.\n  <\/p>\n\n\n  <!-- ======================================\n       PLEIN \u00c9CRAN AVEC FL\u00c8CHES ORANGE\n       ====================================== -->\n\n  <div class=\"yv-lightbox\" role=\"dialog\" aria-modal=\"true\" aria-hidden=\"true\" aria-label=\"Photographie agrandie\">\n\n    <!-- CROIX -->\n\n    <button type=\"button\" class=\"yv-close\" aria-label=\"Fermer\">\u00d7<\/button>\n\n    <!-- FL\u00c8CHE GAUCHE -->\n\n    <button type=\"button\" class=\"yv-zoom-arrow yv-zoom-prev\" aria-label=\"Photo pr\u00e9c\u00e9dente\">\u2039<\/button>\n\n    <!-- PHOTO AGRANDIE -->\n\n    <img class=\"yv-large\" alt=\"\">\n\n    <!-- FL\u00c8CHE DROITE -->\n\n    <button type=\"button\" class=\"yv-zoom-arrow yv-zoom-next\" aria-label=\"Photo suivante\">\u203a<\/button>\n\n    <!-- NOM PHOTO -->\n\n    <div class=\"yv-lightbox-title\"><\/div>\n\n    <!-- COMPTEUR PLEIN \u00c9CRAN -->\n\n    <div class=\"yv-light-counter\"><\/div>\n\n  <\/div>\n\n<\/div>\n\n\n<!-- ==========================================\n     JAVASCRIPT COMPLET\n     ========================================== -->\n\n<script>\n(function () {\n\n  \"use strict\";\n\n  const root = document.getElementById(\n    \"yovo-friends-coverflow\"\n  );\n\n  if (!root || root.dataset.initialized) return;\n\n  root.dataset.initialized = \"true\";\n\n  const stage = root.querySelector(\".yv-stage\");\n\n  const cards = Array.from(\n    root.querySelectorAll(\".yv-stage .yv-card\")\n  );\n\n  const dots = root.querySelector(\".yv-dots\");\n  const counter = root.querySelector(\".yv-counter\");\n  const name = root.querySelector(\".yv-name\");\n  const auto = root.querySelector(\".yv-auto\");\n  const reset = root.querySelector(\".yv-reset\");\n\n  const lightbox = root.querySelector(\".yv-lightbox\");\n  const large = root.querySelector(\".yv-large\");\n\n  const lightTitle = root.querySelector(\n    \".yv-lightbox-title\"\n  );\n\n  const lightCounter = root.querySelector(\n    \".yv-light-counter\"\n  );\n\n  const images = cards.map(\n    card => card.querySelector(\"img\")\n  );\n\n  let current = 0;\n  let timer = null;\n  let startX = null;\n  let lightTouchX = null;\n  let lastFocus = null;\n  let previousOverflow = \"\";\n\n  const total = cards.length;\n\n  if (!total) return;\n\n\n  \/* ======================================\n     NUM\u00c9ROTATION AUTOMATIQUE\n     ====================================== *\/\n\n  function numeroter(index) {\n\n    return String(index + 1).padStart(2, \"0\") +\n      \" \/ \" +\n      String(total).padStart(2, \"0\");\n\n  }\n\n\n  \/* ======================================\n     BOUTON LECTURE AUTOMATIQUE\n     ====================================== *\/\n\n  function actualiserBouton() {\n\n    const lecture = timer !== null;\n\n    auto.classList.toggle(\n      \"yv-playing\",\n      lecture\n    );\n\n    if (lecture) {\n\n      auto.textContent =\n        \"\u2161 Arr\u00eater le d\u00e9filement\";\n\n    } else {\n\n      auto.innerHTML =\n        '<span class=\"yv-play-icon\" ' +\n        'aria-hidden=\"true\"><\/span>' +\n        'Lecture automatique';\n\n    }\n\n    auto.setAttribute(\n      \"aria-pressed\",\n      lecture ? \"true\" : \"false\"\n    );\n\n  }\n\n\n  \/* ======================================\n     CADRES ADAPTATIFS\n     ====================================== *\/\n\n  function adapterCadres() {\n\n    const largeurScene = stage.clientWidth;\n    const hauteurScene = stage.clientHeight;\n\n    if (!largeurScene || !hauteurScene) return;\n\n    const mobile = window.innerWidth <= 768;\n\n    const largeurMax = Math.min(\n      largeurScene * (mobile ? .68 : .54),\n      550\n    );\n\n    const hauteurMax =\n      hauteurScene * (mobile ? .77 : .82);\n\n    cards.forEach(function (carte) {\n\n      const photo = carte.querySelector(\"img\");\n\n      if (!photo ||\n          !photo.naturalWidth ||\n          !photo.naturalHeight) {\n        return;\n      }\n\n      const ratio =\n        photo.naturalWidth \/ photo.naturalHeight;\n\n      let largeur = largeurMax;\n      let hauteur = largeur \/ ratio;\n\n      if (hauteur > hauteurMax) {\n        hauteur = hauteurMax;\n        largeur = hauteur * ratio;\n      }\n\n      carte.style.setProperty(\n        \"width\",\n        largeur + \"px\",\n        \"important\"\n      );\n\n      carte.style.setProperty(\n        \"height\",\n        hauteur + \"px\",\n        \"important\"\n      );\n\n      carte.style.setProperty(\n        \"max-width\",\n        \"none\",\n        \"important\"\n      );\n\n      carte.style.setProperty(\n        \"aspect-ratio\",\n        \"auto\",\n        \"important\"\n      );\n\n    });\n\n  }\n\n\n  \/* ======================================\n     ARR\u00caTER LECTURE AUTOMATIQUE\n     ====================================== *\/\n\n  function stopAuto() {\n\n    if (timer !== null) {\n      clearInterval(timer);\n    }\n\n    timer = null;\n    actualiserBouton();\n\n  }\n\n\n  \/* ======================================\n     ACTUALISER PHOTO AGRANDIE\n     ====================================== *\/\n\n  function actualiserPleinEcran() {\n\n    const carte = cards[current];\n    const photo = carte.querySelector(\"img\");\n\n    if (!photo) return;\n\n    large.src = photo.src;\n    large.alt = photo.alt;\n\n    lightTitle.textContent =\n      carte.dataset.title || \"\";\n\n    lightCounter.textContent =\n      numeroter(current);\n\n  }\n\n\n  \/* ======================================\n     COVERFLOW 3D ORIGINAL\n     ====================================== *\/\n\n  function show(index) {\n\n    current = (index + total) % total;\n\n    cards.forEach(function (card, i) {\n\n      let diff = i - current;\n\n      if (diff > total \/ 2) {\n        diff -= total;\n      }\n\n      if (diff < -total \/ 2) {\n        diff += total;\n      }\n\n      const distance = Math.abs(diff);\n\n      const scale =\n        distance === 0 ? 1 :\n        distance === 1 ? .78 : .60;\n\n      const x = diff * 68;\n      const rotation = -diff * 35;\n\n      card.style.transform =\n        \"translate(-50%,-50%) \" +\n        \"translateX(\" + x + \"%) \" +\n        \"rotateY(\" + rotation + \"deg) \" +\n        \"scale(\" + scale + \")\";\n\n      card.style.zIndex = 100 - distance;\n\n      card.style.opacity =\n        distance > 2 ? \"0\" :\n        distance === 2 ? \".4\" : \"1\";\n\n      card.style.pointerEvents =\n        distance > 2 ? \"none\" : \"auto\";\n\n      card.classList.toggle(\n        \"active\",\n        i === current\n      );\n\n      card.tabIndex =\n        i === current ? 0 : -1;\n\n      card.setAttribute(\n        \"aria-hidden\",\n        distance > 2 ? \"true\" : \"false\"\n      );\n\n    });\n\n    \/* NOM *\/\n\n    name.textContent =\n      cards[current].dataset.title || \"\";\n\n    \/* COMPTEUR *\/\n\n    counter.textContent =\n      numeroter(current);\n\n    \/* POINT ACTIF *\/\n\n    Array.from(dots.children).forEach(\n      function (dot, i) {\n\n        dot.classList.toggle(\n          \"active\",\n          i === current\n        );\n\n        dot.setAttribute(\n          \"aria-current\",\n          String(i === current)\n        );\n\n      }\n    );\n\n    \/* SYNCHRONISATION PLEIN \u00c9CRAN *\/\n\n    if (lightbox.classList.contains(\"open\")) {\n      actualiserPleinEcran();\n    }\n\n  }\n\n\n  function next() {\n    show(current + 1);\n  }\n\n  function prev() {\n    show(current - 1);\n  }\n\n\n  \/* ======================================\n     CR\u00c9ATION DES POINTS\n     ====================================== *\/\n\n  cards.forEach(function (card, index) {\n\n    const dot = document.createElement(\"button\");\n\n    dot.type = \"button\";\n    dot.className = \"yv-dot\";\n\n    dot.setAttribute(\n      \"aria-label\",\n      \"Photo \" + (index + 1)\n    );\n\n    dot.addEventListener(\"click\", function () {\n\n      stopAuto();\n      show(index);\n\n    });\n\n    dots.appendChild(dot);\n\n\n    \/* CLIC PHOTO CENTRALE *\/\n\n    card.addEventListener(\"click\", function () {\n\n      if (current === index) {\n\n        openPhoto();\n\n      } else {\n\n        stopAuto();\n        show(index);\n\n      }\n\n    });\n\n  });\n\n\n  \/* ======================================\n     NAVIGATION GALERIE\n     ====================================== *\/\n\n  root.querySelector(\".yv-next\")\n    .addEventListener(\"click\", function () {\n\n      stopAuto();\n      next();\n\n    });\n\n  root.querySelector(\".yv-prev\")\n    .addEventListener(\"click\", function () {\n\n      stopAuto();\n      prev();\n\n    });\n\n\n  \/* ======================================\n     RETOUR AU D\u00c9BUT\n     ====================================== *\/\n\n  reset.addEventListener(\"click\", function () {\n\n    stopAuto();\n    show(0);\n\n  });\n\n\n  \/* ======================================\n     LECTURE AUTOMATIQUE\n     ====================================== *\/\n\n  auto.addEventListener(\"click\", function () {\n\n    if (timer !== null) {\n\n      stopAuto();\n\n    } else {\n\n      next();\n\n      timer = setInterval(next, 3000);\n\n      actualiserBouton();\n\n    }\n\n  });\n\n\n  \/* ======================================\n     AGRANDISSEMENT PHOTO\n     ====================================== *\/\n\n  function openPhoto() {\n\n    stopAuto();\n\n    lastFocus = document.activeElement;\n    previousOverflow = document.body.style.overflow;\n\n    actualiserPleinEcran();\n\n    lightbox.classList.add(\"open\");\n    lightbox.setAttribute(\n      \"aria-hidden\",\n      \"false\"\n    );\n\n    document.body.style.overflow = \"hidden\";\n\n    root.querySelector(\".yv-close\").focus();\n\n  }\n\n\n  function closePhoto() {\n\n    lightbox.classList.remove(\"open\");\n\n    lightbox.setAttribute(\n      \"aria-hidden\",\n      \"true\"\n    );\n\n    document.body.style.overflow =\n      previousOverflow;\n\n    large.removeAttribute(\"src\");\n\n    if (lastFocus && lastFocus.focus) {\n      lastFocus.focus();\n    }\n\n  }\n\n\n  \/* ======================================\n     NOUVELLES FL\u00c8CHES EN PLEIN \u00c9CRAN\n     ====================================== *\/\n\n  root.querySelector(\".yv-zoom-prev\")\n    .addEventListener(\"click\", function (e) {\n\n      e.preventDefault();\n      e.stopPropagation();\n\n      prev();\n\n    });\n\n  root.querySelector(\".yv-zoom-next\")\n    .addEventListener(\"click\", function (e) {\n\n      e.preventDefault();\n      e.stopPropagation();\n\n      next();\n\n    });\n\n\n  \/* ======================================\n     FERMETURE PLEIN \u00c9CRAN\n     ====================================== *\/\n\n  root.querySelector(\".yv-close\")\n    .addEventListener(\"click\", closePhoto);\n\n  lightbox.addEventListener(\"click\", function (e) {\n\n    if (e.target === lightbox) {\n      closePhoto();\n    }\n\n  });\n\n\n  \/* ======================================\n     NAVIGATION CLAVIER\n     ====================================== *\/\n\n  document.addEventListener(\"keydown\", function (e) {\n\n    if (lightbox.classList.contains(\"open\")) {\n\n      if (e.key === \"Escape\") {\n\n        e.preventDefault();\n        closePhoto();\n\n      }\n\n      if (e.key === \"ArrowRight\") {\n\n        e.preventDefault();\n        next();\n\n      }\n\n      if (e.key === \"ArrowLeft\") {\n\n        e.preventDefault();\n        prev();\n\n      }\n\n      return;\n\n    }\n\n    if (root.contains(document.activeElement)) {\n\n      if (e.key === \"ArrowRight\") {\n\n        e.preventDefault();\n        stopAuto();\n        next();\n\n      }\n\n      if (e.key === \"ArrowLeft\") {\n\n        e.preventDefault();\n        stopAuto();\n        prev();\n\n      }\n\n    }\n\n  });\n\n\n  \/* ======================================\n     NAVIGATION TACTILE COVERFLOW\n     ====================================== *\/\n\n  stage.addEventListener(\n    \"touchstart\",\n    function (e) {\n\n      startX =\n        e.changedTouches[0].clientX;\n\n    },\n    { passive: true }\n  );\n\n  stage.addEventListener(\n    \"touchend\",\n    function (e) {\n\n      if (startX === null) return;\n\n      const dx =\n        e.changedTouches[0].clientX - startX;\n\n      if (Math.abs(dx) > 35) {\n\n        stopAuto();\n\n        if (dx < 0) {\n          next();\n        } else {\n          prev();\n        }\n\n      }\n\n      startX = null;\n\n    },\n    { passive: true }\n  );\n\n\n  \/* ======================================\n     NAVIGATION TACTILE PLEIN \u00c9CRAN\n     ====================================== *\/\n\n  lightbox.addEventListener(\n    \"touchstart\",\n    function (e) {\n\n      lightTouchX =\n        e.changedTouches[0].clientX;\n\n    },\n    { passive: true }\n  );\n\n  lightbox.addEventListener(\n    \"touchend\",\n    function (e) {\n\n      if (lightTouchX === null) return;\n\n      const dx =\n        e.changedTouches[0].clientX -\n        lightTouchX;\n\n      if (Math.abs(dx) > 35) {\n\n        if (dx < 0) {\n          next();\n        } else {\n          prev();\n        }\n\n      }\n\n      lightTouchX = null;\n\n    },\n    { passive: true }\n  );\n\n\n  \/* ======================================\n     CHARGEMENT PHOTOS\n     ====================================== *\/\n\n  images.forEach(function (photo) {\n\n    photo.addEventListener(\n      \"load\",\n      adapterCadres\n    );\n\n  });\n\n\n  \/* ======================================\n     RESPONSIVE\n     ====================================== *\/\n\n  window.addEventListener(\n    \"resize\",\n    adapterCadres\n  );\n\n  if (\"ResizeObserver\" in window) {\n\n    const observateur =\n      new ResizeObserver(adapterCadres);\n\n    observateur.observe(stage);\n\n  }\n\n\n  \/* ======================================\n     ARR\u00caT SI PAGE MASQU\u00c9E\n     ====================================== *\/\n\n  document.addEventListener(\n    \"visibilitychange\",\n    function () {\n\n      if (document.hidden) {\n        stopAuto();\n      }\n\n    }\n  );\n\n\n  \/* ======================================\n     INITIALISATION\n     ====================================== *\/\n\n  adapterCadres();\n  show(0);\n  actualiserBouton();\n\n  window.addEventListener(\n    \"load\",\n    adapterCadres\n  );\n\n})();\n<\/script>\n\n<!-- ==========================================\n FIN GALERIE YOVO & FRIENDS\n 43 PHOTOS\n ========================================== -->\n","protected":false},"excerpt":{"rendered":"<p>YOVO &amp; FRIENDS \u2039 Yovo &amp; Friends 01 \/ 43 \u203a Lecture automatique \u21ba Revenir au d\u00e9but Faites glisser les photos pour naviguer. Appuyez sur la photo centrale pour l&rsquo;agrandir. \u00d7 \u2039 \u203a<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1219","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":7},"has_hero_section":"disabled"},"_links":{"self":[{"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/pages\/1219","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/comments?post=1219"}],"version-history":[{"count":147,"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/pages\/1219\/revisions"}],"predecessor-version":[{"id":1810,"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/pages\/1219\/revisions\/1810"}],"wp:attachment":[{"href":"https:\/\/yovobassy.com\/index.php\/wp-json\/wp\/v2\/media?parent=1219"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}