> Faqs > Cómo hacer animacion web con el scroll

Cómo hacer animacion web con el scroll

Cómo se hacen las animaciones de las paginas web de oneplus o iPhone?

Me refiero a que mientras bajas por la pagina web el movil se va moviendo de una forma muy dinamica.

Te paso los ejemplos.

https://www.oneplus.com/es/7t

https://www.apple.com/es/

Responder la pregunta
Editar Hacer otra preguntaPreguntar

Respuestas

En la página de OnePlus sí que veo una animación bastante interesante. La de iPhone no.

Las animaciones siempre se tienen que hacer con CSS. Lo que aquí importa es cómo se producen, ya que en el scroll hay una serie de particularidades y para hacer cosas complejas te va a tocar meterle Javascript.

En concreto no sé cómo ellos lo habrán implementado, pero existen librerías bastante útiles para hacer animaciones cuando se produce un scroll en la página. Un ejemplo de librería que te podría recomendar analizar, para ver si te sirve para producir los efectos que estás buscando, es AOS. https://michalsnik.github.io/aos/

También puedes buscar librerías Javascript Parallax, ya que así se suelen denominar a los efectos que se producen cuando se hace scroll. Por ejemplo una bastante sencilla es https://github.com/alexfoxy/laxxx

Alberto
165 8 12 8