Text Marquee on Scroll

Une ligne de contenu défile latéralement en boucle infinie, sans coupure.

Ajoute un texte défilant (Marquee) sur [où] : une bande qui défile horizontalement à l’infini, aussi appelée ticker.
Le contenu doit défiler de droite à gauche à une vitesse lente et régulière, en boucle continue sans saut visible.
Mets-le en pause au survol et arrête le mouvement si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Le défilement vertical fait glisser latéralement une rangée de panneaux épinglée.

Ajoute une section à défilement horizontal (Horizontal Scroll Section) sur [où], aussi appelée horizontal scrolling ou scroll-jacked horizontal gallery.
Quand la section atteint le haut, elle doit rester épinglée pendant que le défilement vers le bas fait glisser sa rangée de panneaux sur le côté, puis se libérer une fois le dernier panneau visible.
Lie le mouvement latéral directement à la position de défilement pour que remonter l’inverse, et reviens à une rangée normale qu’on fait glisser au doigt sur petit écran ou si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Un mot est dupliqué en de nombreuses copies empilées qui se décalent au défilement.

Ajoute un effet « Text Repetition » (aussi appelé repeated text scroll) sur [où].
Un mot doit être copié en une pile de copies en contour plus pâles qui se déploient depuis l’arrière au fil du défilement, puis se replient quand on remonte.
Lie le déploiement directement à la position de défilement et masque les copies supplémentaires aux lecteurs d’écran pour que le mot ne soit lu qu’une fois.

Un titre est découpé en tranches horizontales qui glissent latéralement les unes contre les autres au défilement.

Ajoute un effet « Sliced Text » (aussi appelé on-scroll sliced text) sur [où].
Un grand titre doit être découpé en tranches horizontales qui glissent latéralement les unes contre les autres au défilement, alignées en un mot complet au départ.
Lie le décalage directement à la position de défilement pour qu’il s’inverse en remontant, et garde le titre comme un seul texte lisible pour les lecteurs d’écran.

Un élément ou une scène s’agrandit ou rétrécit au fil du défilement.

Ajoute un effet « Zoom on Scroll » (aussi appelé scroll zoom ou scale on scroll) sur [où].
Tant que la section reste à l’écran, l’élément doit grandir en douceur d’une petite carte jusqu’à remplir toute la vue, au rythme du défilement, puis rétrécir quand on remonte.
Mets-le à l’échelle sans décaler la mise en page autour, et affiche-le à sa taille finale sans zoom si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Un en-tête se masque quand on fait défiler vers le bas et réapparaît quand on remonte.

Ajoute un « Hide on Scroll Header » (aussi appelé headroom ou auto-hide navbar) sur [où].
L’en-tête doit glisser vers le haut hors de la vue quand on fait défiler vers le bas et revenir dès qu’on remonte : rapide et fluide, en réagissant au sens du défilement plutôt qu’à la distance.
Affiche-le toujours tout en haut de la page, ignore les petits à-coups de défilement, et garde-le visible tant qu’un élément à l’intérieur a le focus clavier.