Efecto Parallax: movimiento 3D en tus paginas

como hacer efecto parallaxSeguramente has visto esas páginas web donde al hacer scroll las cosas se mueven a diferentes velocidades pareciendo que flotaran en 3D en diferentes planos….ese es el Efecto Parallax.

Aquí te enseño como hacerlo en tus páginas…

El Efecto Parallax

El efecto Parallax es bastante moderno y consiste en una técnica que a través del movimiento de diversas capas de imágenes en el sitio web, a diferentes velocidades, crean una ilusión 3D.

 El término efecto «Parallax» deriva del griego Parallaxis, palabra, que significa alteración.

Este es un efecto que se ha estado utilizando en diseño web desde hace un tiempo, y cada vez es mas común.

Por eso, me decidí a grabar un video para enseñarte como hacerlo de forma fácil y efectiva.

Aquí va:

Descargar plugin: http://markdalgleish.com/projects/stellar.js/

Descargar jQuery: http://code.jquery.com/jquery-2.1.1.min.js

Si quieres aprender mucho mas sobre maquetación web,
te recomiendo el siguiente recurso:

Cuso de Maquetacion Web PSD a HTML

Cursos de Desarrollo Web

 

Cursos de desarrollo web:

[featured_products per_page="12" columns="4"]

Diseñador y Programador Web Full-Stack especializado en PHP / MySQL / Laravel / Wordpress / HTML5 / CSS3 / JS.

5 thoughts on “Efecto Parallax: movimiento 3D en tus paginas

  1. Michael Reply

    Muy interesante este tutorial hoy por hoy he visto en páginas muy profesionales este efecto gracias por innovar y ayudarnos Cristian saludos desde Barcelona

  2. Alberto Reply

    Muy interesante el tutorial y muy bien explicado. Me gustaría saber como se podría utilizar del mismo modo en un tema wordpress creado por mi mismo.
    Gracias por tu ayuda.

    1. Cristian - PSD a HTML Paso a Paso Post author Reply

      Alberto
      Para ello deberias saber perfectamente como armar un tema de WordPress y luego insertarle dicho efecto en la estructura HTML.
      Te recomiendo mi videotutorial de creacion de temas para WordPress.
      Accede en:
      http://creatutemadewordpress.com

      Saludos!
      Cristian

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.