From e30704e6efec64d571e918ab5e05417a7ffbbf98 Mon Sep 17 00:00:00 2001 From: Serge RAKOTO HARRY-NAIVO Date: Thu, 7 May 2026 15:37:33 +0200 Subject: [PATCH] fix(js): IntersectionObserver threshold 0.1 \xe2\x86\x92 0 for animate-on-scroll Bug: on mobile portrait, content of cgv.html and politique-confidentialite.html stays invisible because the .animate-on-scroll blocks (data-lang-block FR/EN/MG trilingual content) are 2000-3000px tall and the viewport (~600px) never reaches the 10% intersection ratio required to trigger the .visible class. Symptom: page appears empty on mobile until user resizes the window (= triggers re-evaluation). Reported by Serge during post-cutover E2E retest 2026-05-07. Other pages (mentions-legales, accueil, etc.) unaffected because their .animate-on-scroll blocks are short enough to satisfy the previous 10% threshold. Fix: threshold: 0 fires as soon as any pixel of the element enters the viewport. rootMargin -50px bottom kept to give a small buffer before triggering animation. Refs: post-cutover polish (companion to PR #6 chore polish). --- js/main.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/js/main.js b/js/main.js index 6c945f2..e81232b 100644 --- a/js/main.js +++ b/js/main.js @@ -118,7 +118,12 @@ function setupAnimations() { observer.unobserve(entry.target); } }); - }, { threshold: 0.1, rootMargin: '0px 0px -50px 0px' }); + // threshold: 0 (= fire dès qu'1px du bloc entre dans le viewport). + // Avant : threshold 0.1 (= 10%) ne fire jamais sur mobile portrait pour + // les pages cgv.html + politique-confidentialite.html dont les blocs + // .animate-on-scroll font 2000-3000px de hauteur (contenu trilingue + // FR/EN/MG verbose) — la viewport mobile ~600px n'atteint jamais 10%. + }, { threshold: 0, rootMargin: '0px 0px -50px 0px' }); elements.forEach(el => observer.observe(el)); } -- 2.45.2