Parallax-Slider

Parallax-Slider

Hace unos meses, en este blog de diseño web, vimos unos ejemplos de las últimas tendencias de diseño, el Parallax.

Hoy vamos a ver un ejemplo más de cómo hacer un slider con Parallax, en el que podemos ver cómo los elementos del diseño aparecen y desaparecen con distintos efectos.

En este ejemplo vamos a ver cómo controlar el comportamiento de cada elemento, dándole una clase. Cuando queremos desplazarlo a la derecha, por ejemplo, utilizamos la clase “da-slide-toright”.

Las clases utilizadas son:

  • .da-slide-fromright
  • .da-slide-fromleft
  • .da-slide-toright
  • .da-slide-toleft

El efecto Parallax se crea moviendo el fondo en dirección opuesta al movimiento del objeto. Con bgincrement, podremos controlar la cantidad de píxeles que tiene que moverse.

A continuación os dejo el enlace para ver y descargar el código de Tympanus.net