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 Efectos flotantes extensión en Complementos maestros para Elementor agrega ese movimiento continuo a cualquier elemento, 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 de complementos maestros para Elementor que agrega una animación continua en bucle a cualquier elemento, sección, columna o widget de Elementor. Anima el elemento con traducir, girar, y escala se transforma y te permite controlar el duración, retraso, y dirección del movimiento. Debido a que el efecto está basado en CSS, el elemento sigue flotando por sí solo sin una biblioteca de animación JavaScript pesada.
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 « mueve el elemento a lo largo del eje X o Y, el clásico flotador de arriba y abajo o de lado a lado.
- Girar « gira el elemento ligeramente hacia adelante y hacia atrás para un suave balanceo.
- Escala « crece y encoge el elemento para lograr un efecto de pulsación suave.
- Duración, Retraso y Dirección « establece cuánto tiempo tarda un ciclo, cuánto tiempo esperar antes de que comience y en qué dirección se ejecuta el movimiento, para que la animación coincida con el ritmo de la sección.
Cómo agregar efectos flotantes en Elementor #
Efectos flotantes se aplica por elemento 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 para Elementor está instalado y activo, y que la extensión Efectos flotantes está habilitada en el panel Complementos maestros.
- En el editor Elementor, seleccione la sección, columna o widget que desea animar.
- Abra la configuración del elemento y busque los complementos maestros Efectos flotantes controla y luego cambia el efecto.
- Elige una transformación « Traducir, Girar, sau Escala « y establece el duración, retraso, y dirección.
- 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?
Efectos flotantes es un complemento maestro para la extensión de movimiento Elementor que agrega una animación continua en bucle a cualquier elemento Elementor. Utiliza transformaciones de traducción, rotación y escala y le permite controlar la duración, el retraso y la dirección del movimiento, todo sin escribir CSS o 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?
Sí. Cada efecto expone controles de duración, retraso y dirección. La duración establece cuánto tiempo tarda un ciclo, el retraso establece cuánto tiempo esperar antes de que comience el movimiento y la dirección establece en qué dirección se ejecuta la animación, para que pueda hacer coincidir la flotación con el ritmo de la sección.
¿funciona Floating Effects en algún elemento Elementor?
Sí. La extensión se aplica a secciones, columnas y widgets de Elementor, por lo que puede hacer flotar una imagen, un ícono, un encabezado, un botón o una sección completa. Lo habilitas por elemento desde el editor Elementor una vez que la extensión está activada en el panel Complementos maestros.
¿las animaciones flotantes ralentizarán mi sitio web?
El efecto está basado en CSS, por lo que es liviano en comparación con las pesadas bibliotecas de animación de JavaScript. Para mantener las páginas fluidas, úselas solo en 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.
