Pinning

El texto queda fijo mientras sus líneas aparecen y desaparecen según el avance del scroll.

Añade un efecto "Sticky Text Fade" (también llamado sticky scroll text opacity fade) en [dónde].
Mientras la sección avanza con el scroll, el bloque de texto debe quedarse fijo en su sitio y sus líneas deben aparecer y desaparecer una a una según el avance del scroll.
Liga los fundidos directamente a la posición del scroll para que al volver se inviertan, y mantén todas las líneas disponibles para los lectores de pantalla, sea cual sea su opacidad.

Las tarjetas se quedan fijas arriba al hacer scroll y se apilan unas sobre otras, a menudo encogiendo las anteriores.

Añade "Stacking Cards" (también llamadas sticky stacking cards o card stack scroll) en [dónde].
Al hacer scroll, cada tarjeta debe quedarse fija cerca de la parte superior y la siguiente debe subir por encima, mientras las de debajo se encogen un poco para formar una pila ordenada.
Deja visible un borde fino de cada tarjeta anterior y da a la última espacio suficiente para llegar a su sitio antes de que termine la sección.

El scroll vertical desplaza de lado una fila de paneles fijada en pantalla.

Añade una "Horizontal Scroll Section" (también llamada horizontal scrolling o scroll-jacked horizontal gallery) en [dónde].
Cuando la sección llegue arriba, debe quedarse fijada mientras el scroll hacia abajo desplaza su fila de paneles de lado, y soltarse cuando el último panel esté a la vista.
Vincula el movimiento lateral directamente a la posición del scroll para que al volver atrás se invierta, y usa una fila normal deslizable en pantallas pequeñas o si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Un encabezado fijo reduce su altura o tamaño cuando el usuario baja por la página.

Añade un "Sticky Header Shrink" (también llamado shrinking header o shrink on scroll) en [dónde].
El encabezado debe quedarse arriba y, en cuanto el lector baje un poco, encogerse suavemente hasta una barra más delgada con un logo más pequeño, y volver a crecer al regresar arriba del todo.
Evita que el contenido de abajo salte mientras el encabezado cambia de tamaño.

Una barra o un anillo se va llenando a medida que el usuario se desplaza por la página o el artículo.

Añade una barra de progreso de lectura (Scroll Progress Indicator, también llamada reading progress bar) en [dónde].
Una barra fina en la parte superior debe llenarse de izquierda a derecha según lo que el lector haya avanzado, hasta ocupar todo el ancho al final.
Vincúlala directamente a la posición del scroll, sin retraso de suavizado, y evita que tape el contenido.

El desplazamiento se detiene en puntos de ajuste definidos, como diapositivas o secciones.

Añade "Scroll Snap" (también llamado scroll snapping o snap scrolling) en [dónde].
Cuando el scroll se detenga, la vista debe asentarse limpiamente en la sección más cercana para que cada una quede alineada con el borde en lugar de pararse a medias.
Usa el ajuste nativo del navegador para que el scroll con rueda, táctil y teclado siga funcionando, y asegúrate de que el contenido más alto que la pantalla se pueda leer entero.

El progreso de la animación está ligado directamente a la posición del scroll, así que al avanzar o retroceder se reproduce o se rebobina.

Añade una "Scroll-Linked Animation" (también llamada scroll-driven animation o scroll scrub) en [dónde].
La animación debe moverse exactamente con la posición del scroll: al bajar avanza y al subir se rebobina al instante, sin un suavizado temporal propio.
Asigna toda la animación a un tramo de scroll claro y muestra un estado estático razonable si el usuario prefiere movimiento reducido (prefers-reduced-motion).