Sección fijada con pasos que cambian
El escenario se queda quieto mientras el scroll cambia el texto y la forma de cada paso, con indicador lateral. Autocontenida en su panel.
Descargar gratisEfectos de scroll para React
Secciones fijadas con pasos que cambian, galerías horizontales guiadas por el desplazamiento, pilas de tarjetas pegajosas, paralaje, texto que se ilumina palabra a palabra y barras de progreso de lectura.
La mayoría usa position: sticky y eventos pasivos en lugar de capturar el scroll, para que la página siga fluida.
Para qué sirven
- Narrativas de producto que avanzan con el scroll
- Artículos largos con progreso de lectura
- Portadas con efecto de profundidad
8 componentes de scroll
Pila de tarjetas pegajosas
Cada tarjeta queda fija bajo la anterior mientras esta se encoge y se oscurece con el avance; solo sticky y una variable.
Descargar gratisGalería horizontal guiada por scroll
El escenario queda fijo y la fila de paneles se desplaza de lado según el avance vertical, con barra de progreso.
Descargar gratisTexto que se ilumina palabra a palabra
Cada palabra pasa de gris tenue a tinta según el scroll; el texto completo es legible para lectores de pantalla desde el inicio.
Descargar gratisArtículo con barra de progreso de lectura
Barra de avance, minutos restantes, sección actual y botón de volver arriba que aparece al avanzar.
Descargar gratisEscena con paralaje de montañas
Sol, tres capas de montañas y un titular se mueven a velocidades distintas mientras la niebla se despeja.
Descargar gratisImagen que crece hasta ocupar todo
Una tarjeta pequeña se expande a pantalla completa mientras el titular se desvanece y aparece el texto.
Descargar gratisMarquesina sensible a la velocidad del scroll
Avanza despacio por sí sola, se acelera con la velocidad del desplazamiento y cambia de dirección si subes.
Descargar gratis