Desliza para empezar la magia
El contenedor padre usa position: sticky para quedarse fijo mientras tú sigues haciendo scroll hacia abajo.
El contenido interior se mueve en el eje X usando translateX sincronizado con tu movimiento vertical.
Sin librerías de JavaScript pesadas como GSAP o Locomotive. Todo calculado por el motor de renderizado del navegador.
Las tarjetas se quedan pegadas y se encogen al fondo.
Cada sección es independiente pero fluye con la narrativa global del sitio.
Al ejecutarse en el compositor thread del navegador, estas animaciones son mucho más fluidas que JS.
Funciona perfectamente en móviles, donde el evento scroll de JS solía dar problemas.
CSS moderno nos permite contar historias visuales complejas con menos código.
"La creatividad es inteligencia divirtiéndose. Con CSS Scroll-Driven Animations, la web se convierte en un lienzo infinito donde la interacción define la experiencia."