Una sección estática se lee como una imagen plana. Dale una deriva suave y circular y el mismo elemento se sentirá vivo. El Extensión de efectos flotantes en Complementos maestros Pro agrega ese movimiento continuo a cualquier widget Elementor, sin fotogramas clave ni CSS personalizado para escribir. Esta guía explica qué hace la extensión, qué puede animar y cómo aplicarla.
¿qué es la extensión de efectos flotantes? #
El Efectos flotantes la extensión es una herramienta de movimiento Master Addons Pro que agrega una animación continua en bucle a los widgets Elementor. Mueve el widget entre un valor De y un Valor A traducir, girar y escala se transforma, luego regresa y cada transformación tiene Duración y Retraso campos. El movimiento se ejecuta en la pequeña biblioteca anime.js con una facilidad suave de entrada y salida. Las secciones, columnas y contenedores no obtienen el panel.
Lo que puedes animar #
Los efectos flotantes funcionan a través de tres tipos de transformación y los combinas con controles de tiempo para dar forma al movimiento:
- Traducir: Traduce X y Traduce Y, cada uno con un valor From y To entre -100 y 100 px, para el clásico flotador de arriba y abajo o de lado a lado.
- Girar: Gire X, Y y Z entre -180 y 180 grados, girando el widget hacia adelante y hacia atrás para balancearlo.
- Escala: Escala X y Escala Y entre 0 y 5, haciendo crecer y reducir el widget para obtener un pulso suave.
- Duración y retraso: La duración sube a 10000 ms (1000 cuando se deja vacío) y se retrasa hasta 5000 ms. Cuando activas más de una transformación, comparten una línea de tiempo, usando primero el tiempo de Translate, luego el de Rotate y luego el de Scale.
Cómo agregar efectos flotantes en Elementor #
Efectos flotantes se aplica por widget desde el editor Elementor, una vez habilitada la extensión en Complementos maestros. En resumen: seleccione el elemento que desea animar, abra su configuración, active Efectos flotantes y elija una transformación con su sincronización.
- Asegúrate Complementos maestros Pro está instalado y activo, y que la extensión Efectos flotantes está habilitada en el panel Complementos maestros.
- En el editor Elementor, seleccione el widget que desea animar.
- Abra la configuración del elemento y busque los complementos maestros Efectos flotantes controla y luego cambia el efecto.
- Encender Traducir, Girar o Escala, establezca los valores Desde y Hasta, luego el Duración y Retraso.
- Obtenga una vista previa o publique la página para ver la deriva del elemento en el sitio en vivo.
Consejos para utilizar efectos flotantes #
- Mantenga el movimiento sutil. Una pequeña distancia de traducción y una duración lenta leídos como pulidos; El movimiento grande y rápido parece distraer.
- Úselo en uno o dos elementos por vista. Una sola imagen o ícono de héroe flotante llama la atención; una página entera en movimiento compite consigo misma.
- Combínalo con el movimiento de entrada. Combine efectos flotantes con el Animación de entrada extensión para que un elemento entre primero y luego mantenga su suave flotación.
- Compruébalo en el móvil. Confirme que el movimiento todavía se vea bien en pantallas más pequeñas y no envíe contenido cercano.
Preguntas frecuentes #
¿qué es la extensión Efectos flotantes en Master Addons?
Floating Effects es una extensión Master Addons Pro que agrega una animación continua en bucle a los widgets Elementor. Mueve un widget de un lado a otro entre valores de From y To con transformaciones de traducción, rotación y escala, con configuraciones de duración y retardo y sin CSS ni fotogramas clave personalizados.
¿qué tipos de animación pueden crear los efectos flotantes?
Admite tres tipos de transformación: traducir para mover un elemento hacia arriba y hacia abajo o de lado a lado, girar para un suave balanceo hacia adelante y hacia atrás y escalar para lograr un efecto de pulsación suave. Puede combinar una transformación con ajustes de tiempo para dar forma al movimiento exacto que desea.
¿Puedo controlar la velocidad y dirección de la animación flotante?
Velocidad, sí. Cada transformación tiene campos Duración y Retardo, pero las transformaciones combinadas comparten una línea de tiempo, usando Traducir primero, luego Girar y luego Escalar. No hay configuración de dirección: el movimiento siempre se reproduce desde el valor De al valor A y viceversa.
¿funciona Floating Effects en algún elemento Elementor?
Funciona únicamente en widgets, como una imagen, un icono, un encabezado o un botón. Las secciones, columnas y contenedores no obtienen el panel Efectos flotantes, por lo que para hacer flotar un grupo de elementos, agregue el efecto a cada widget.
¿las animaciones flotantes ralentizarán mi sitio web?
El movimiento recorre la pequeña biblioteca anime.js y solo anima las transformaciones CSS, que los navegadores manejan bien. Para mantener las páginas fluidas, utilícelas en solo uno o dos elementos por vista y mantenga el movimiento sutil en lugar de animar todo lo que hay en la página a la vez.
¿los efectos flotantes son gratuitos?
No. Efectos flotantes es parte de Master Addons Pro. Free Elementor tiene animaciones de entrada que se reproducen una vez, pero no hay flotación en bucle.
