Crear imágenes con el efecto Scrolling Mouse Parallax en Divi sin plugins

Inicio / Tutoriales Premium / Tema Divi / Crear imágenes con el efecto Scrolling Mouse Parallax en Divi sin plugins

Contenido Restringido🖐

Accede a este y otros contenidos siendo premium. ¿Aún no eres premium? Adquiere una membresía aquí ⭐

Profesor: Ameth Cruz

  30 de octubre de 2020

En este videotutorial prémium aprenderás a crear imágenes con el efecto Scrolling Mouse Parallax en Divi sin plugins. Será un tutorial Snippet avanzado de nuestro profesor Ameth Cruz. Vamos allá.

Recuerda que puedes descargar tanto el archivo .JSON como el código que se usó en el tutorial en la parte inferior, en la zona de recursos del tutorial.

Índice

Objetivo del profesor:

Qué tal Divi lovers, en el siguiente documental les enseñaré a crear un efecto tipo parallax activado con el movimiento del mouse, utilizando el módulo de imagen, un plugin y un script jQuery.

También les enseñaré a crear un background bi-color de ancho completo, utilizando unas sencillas configuraciones de la sección, esto muy ideal para aumentar nuestros visuales de los diseños de interfaz de nuestros sitios web.

Primero vamos a crear nuestro módulo de imagen, vamos a configurarla para que se vea correctamente de buen tamaño y centrada, posteriormente vamos a añadir clases tanto al módulo de imagen, como a la fila, la cuales nos servirán posteriormente para añadirlas a nuestro script con el que haremos funcionar nuestro efecto.

Este tipo de añadidos a nuestros diseños o sitios web, son muy útiles a la hora de querer dotar de animaciones o para nuestro sitio no se vea tan estático ni plano, sino más bien que el usuario sienta que está navegando de una manera fluida y cómoda.

Además de que veremos una forma más de extender los límites del módulo de imagen de Divi. Con lo cual estaremos ampliando más de herramientas nuestras habilidades como desarrollador de sitios con el Divi Theme.

Recuerda ver los tutoriales relacionados de nuestro profesor Ameth Cruz para aprender a integrar snippets avanzados dentro de Divi.

Resultado:

Lograremos un resultado igual a este:

Si te ha gustado este contenido no olvides compartirlo con tus amigos y conocidos, además recuerda que puedes compartirnos el enlace de tu creación en los comentarios de este contenido, así todos veamos los resultados maravillosos que conseguiste con este contenido prémium.

3 Comentarios

  1. GUILLERMO C

    Interesante efecto, bien explicado para ir subiendo el nivel , gracias !!

    Responder
  2. Héctor N

    Trate de hacer el mismo efecto en otras secciones cambiando nombres y no jalo…. que puede ser?

    Responder
    • Jefferson M

      Que tal Hector, intentaste hacerlo todo de cero o usaste la plantilla descargada en nuestro sitio?

      Responder

Enviar un comentario

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

Iniciar Sesión

¿No tienes cuenta? Registrarse

Otros planes

¡Accede a más de 1330 contenidos especializados en Diseño Web con Divi por un solo precio!

Trimestral

Ahorra 6 USD 🔥

$US 18/ Mes

*Pagando US$ 54 cada 3 meses

¿A qué accedes con este plan?

Lifetime

Un solo pago 🔥

$US 499/ Lifetime

*UN SOLO PAGO DE POR VIDA

¿A qué accedes con este plan?

Con este plan accedes a:

  1. ✅ Todos los cursos
  2. ✅ Todos los tutoriales prémium
  3. ✅ Todos los plugins y layouts
  4. ✅ Soporte prémium vía email
  5. ✅ Acceso a la comunidad en Discord

Con este plan accedes a:

  1. ✅ Todos los cursos
  2. ✅ Todos los tutoriales prémium
  3. ✅ Todos los plugins y layouts
  4. ✅ Soporte prémium vía email
  5. ✅ Acceso a la comunidad en Discord
  6. ✅ Descuentos en Templates para Divi

Black
Friday

Accede a más de 1260 contenidos para aprenderDivi de manera profesional