Skip to content

feat(count-up-animation): count-up animation des stats avec IntersectionObserver#33

Merged
Zallom merged 1 commit into
feat(WebflowMigration)from
feat(count-up-animation)
May 22, 2026
Merged

feat(count-up-animation): count-up animation des stats avec IntersectionObserver#33
Zallom merged 1 commit into
feat(WebflowMigration)from
feat(count-up-animation)

Conversation

@Zallom
Copy link
Copy Markdown
Member

@Zallom Zallom commented May 22, 2026

Sous-PR de #25. Reproduit l'animation Webflow : quand la section About entre dans le viewport, les 4 compteurs montent de 0 jusqu'à leur valeur cible en 2s, avec un easing cubic ease-out identique au source (1 - (1-p)^3).

  • IntersectionObserver (threshold 0.1) attaché à chaque counterItem
  • requestAnimationFrame pour le tick, cancelAnimationFrame au cleanup
  • animatedRef empêche de relancer l'animation au re-render
  • prefers-reduced-motion : on affiche directement la valeur finale

Reproduit l'anim Webflow : quand la section About entre dans le viewport,
les 4 compteurs montent de 0 jusqu'à leur valeur cible en 2s avec un easing
cubic ease-out (1 - (1-p)^3), via requestAnimationFrame.

- IntersectionObserver attaché au counterItem (threshold 0.1)
- animatedRef évite de relancer l'animation au re-render
- prefers-reduced-motion : on saute l'animation et on affiche directement
  la valeur finale
@Zallom Zallom merged commit f596120 into feat(WebflowMigration) May 22, 2026
@Zallom Zallom deleted the feat(count-up-animation) branch May 22, 2026 17:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant