Qu'est-ce que Generateur d'animations au defilement ?
Generateur d'animations au defilement est un outil dans le navigateur pour cette tâche : Générez des animations CSS au defilement avec animation-timeline. La sortie reste lisible afin de la vérifier avant de l'utiliser sur un site publié.
Quick answer
Scroll-driven animations let you link an animation progress directly to the scroll position of a container, eliminating the need for scroll event listeners and JavaScript-based parallax libraries.
Limitations
- Chrome 115+ and Edge 115+ support scroll-driven animations. Firefox and Safari do not yet support the ScrollTimeline API.
- Scroll-driven animations use the Web Animations API. CSS @keyframes are still required for defining animation states.
- Scroll() and view() timing progress is determined by scroll distance. Animations may behave differently on very short or very long content.
Comment utiliser cet outil
- Ouvrez l'outil et saisissez les valeurs utiles.
- Vérifiez la sortie dans le panneau de résultat.
- Copiez seulement la partie adaptéeà votre page.
- Testez la modification avant publication.
A quoi il sert
- Gagner du temps sur les tâches de publication récurrentes.
- Préparer markup, CSS ou checklist avant lancement.
- Eviter les petites erreurs faciles a manquer sur un site statique.