Quiere aplicar un efecto de desplazamiento en Elementor?
Una de las cosas convincentes al diseñar una página o plantilla usando Elementor es que puedes aplicar ciertos efectos de animación a la página o plantilla en la que estás trabajando. Uno de ellos es un efecto de desplazamiento que cubriremos en este artículo.
El efecto de desplazamiento en sí es una característica disponible en Elementor Pro. Por lo tanto, debe actualizar su Elementor a la versión pro en caso de que no lo hayas hecho.
¿Qué es el efecto de desplazamiento?
Este es un tipo de efecto de animación que ocurre cuando los usuarios desplazan el mouse sobre una página. Ya sea arriba o abajo. El efecto puede variar dependiendo de su configuración. El propio Elementor ofrece 6 opciones de efectos:
- Desplazamiento vertical: el objeto se moverá verticalmente al desplazar el mouse
- desplazamiento horizontal: el objeto se moverá horizontalmente al desplazar el mouse
- Transparencia: El objeto aparecerá como transparente antes del desplazamiento del mouse
- Borroso: El objeto aparecerá borroso antes del desplazamiento del mouse
- Escalera: El objeto aparecerá en una cierta escala antes de que el mouse se desplace.
Puede aplicar un efecto de desplazamiento ya sea en una sección, una columna o un widget.
Cómo aplicar el efecto de desplazamiento en Elementor
Como mencionamos, el efecto de desplazamiento es una de las características de Elementor Pro. En otras palabras, debe estar usando Elementor Pro para usar esta función.
En este tutorial, le mostraremos cómo aplicar un efecto de desplazamiento horizontal. Como sugiere el nombre, este efecto aplicará movimiento vertical a un objeto cuando se desplaza el mouse. Este efecto es excelente cuando se combina con Lottie.
A continuación se muestra un ejemplo antes de aplicar el efecto de desplazamiento horizontal.
Y aquí está el ejemplo después de aplicar el desplazamiento horizontal.
Nota: El siguiente tutorial usa Lottie.
Efecto de desplazamiento agregado
Nuevamente, puede aplicar el efecto de desplazamiento a una sección, columna o widget.
Primero, seleccione un elemento (sección, columna o widget) en el que desea aplicar el efecto de desplazamiento y vaya a la pestaña Avanzado en el panel izquierdo y abra la sección Efectos de movimiento.
Activar opción Efectos de desplazamiento.
Como queremos aplicar el efecto de desplazamiento horizontal, haga clic en el icono de lápiz en la opción Desplazamiento horizontal para realizar ajustes como la dirección (izquierda o derecha), la velocidad y la ventana (el área visible para el usuario).
Puede aplicar varios efectos de desplazamiento si lo desea. Simplemente haga clic en el ícono del lápiz en otras opciones de efectos de desplazamiento para aplicar otros efectos de desplazamiento.
Eso es. Una vez que la página esté completa, puede publicar / actualizarla. También puede desactivar el efecto de desplazamiento en un determinado tipo de dispositivo. Simplemente elimine el dispositivo en el que desea desactivar el efecto de desplazamiento haciendo clic en el icono X en el campo Aplicar efectos a .
¡Consigue Elementor Pro ahora!
Conclusión
Listo ! Eso es todo por este artículo que le muestra cómo aplicar efecto de desplazamiento en Elementor. Si tiene alguna inquietud sobre cómo llegar, háganoslo saber dentro de comentarios.
Sin embargo, también puedes consultar nuestros recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress o el de Divi: el mejor tema de WordPress de todos los tiempos.
Pero mientras tanto, comparte este artículo en tus diferentes redes sociales.
...
