Ejemplos prácticos con HTML5: Scroll

Los efectos de scroll aplicados sobre páginas HTML5 son útiles debido a la necesidad de facilitar la navegación a los usuarios de dispositivos móviles que entran en nuestro sitios. 

Pero en vez de ser una limitación, el uso de estructuras verticales ha servido para añadir atractivo a nuestras páginas gracias a la combinación de animaciones de distinto tipo, e incluso a aportarles información.

En este curso aprenderás a crear este tipo de efectos en tres ejemplos basados en JavaScript y CSS, que van a empezar con un ejemplo simple de parallax, para terminar con otro un poco más complejo y así abarcar las distintas opciones de efectos de scroll que podemos añadir a nuestros front-ends.

En muchos casos, la simple navegación vertical no es suficiente: En este ejercicio vamos a mezclar el uso del scroll con efectos parallax con la navegación horizontal para moverse entre apartados, y con ello tendremos todo un sistema complejo y atractivo de navegación.

Este capítulo va a servir como ejemplo de uso de un sistema de scroll creativo que, además de permitir ir accediendo a los contenidos, añade animación a la escena aportando así información visual a las imágenes y el texto.