Efectos flotantes
Vaya más allá de la flotación básica hacia arriba y hacia abajo. La extensión Efectos flotantes le brinda controles de animación de nivel profesional para cualquier elemento. Animar de forma independiente la posición de un elemento (Traducir), hacerlo girar en cualquier eje 3D (Girar X, Y, Z) y estirarlo o aplastarlo (Escala X, Y). Cree un logotipo que se incline, una insignia que pulse o una imagen que se desvíe y gire suavemente. Todo está controlado con campos numéricos simples y casillas de verificación directamente en su editor Elementor. Sin complementos, sin código, solo una animación poderosa a tu alcance.
Movimiento Multidireccional (Traducir)
Dale a tus elementos una sensación de movimiento suave y flotante. Utilice los controles Translate para moverlos horizontalmente (eje X) o verticalmente (eje Y). Establezca un punto de partida y un punto final en píxeles para crear un efecto de deriva hacia adelante y hacia atrás o hacia arriba y hacia abajo. Perfecto para llamar la atención sobre características clave o agregar un toque divertido a su diseño.
- Flotador horizontal: haga que un elemento se desvíe de izquierda a derecha (Traducir X) como una nube de movimiento lento.
- Rebote vertical: cree un suave rebote hacia arriba y hacia abajo (Traducir Y) para íconos o insignias.
- Combinar para caminos complejos: use X e Y juntos para caminos flotantes diagonales o circulares.
Escalado, rotación y sincronización
Vaya más allá del simple movimiento hacia arriba y hacia abajo. Haga que los elementos respiren escalándolos. Utilice la Escala X y la Escala Y de forma independiente para estirar o aplastar el ancho y el alto de un elemento por separado. Agregue rotación para un giro lento y continuo. Esto le permite crear de todo, desde un botón de llamada a la acción que pulsa suavemente hasta un logotipo que gira lentamente.
- Efectos pulsantes: utilice la escala X/Y para hacer que un elemento crezca y se encoja rítmicamente, atrayendo la atención.
- Control independiente: estire el ancho de un elemento (Escala X) manteniendo su altura igual para un movimiento único.
- Giro continuo: aplique rotación para un giro lento e interminable en logotipos o íconos decorativos.
Preguntas frecuentes sobre efectos flotantes
Esto parece complejo. ¿Es difícil de usar?
¡En absoluto! El panel puede parecer detallado porque es poderoso, pero empiezas simple. Simplemente habilite un efecto (como Translate Y), establezca un pequeño valor “To” (como 20px) y tendrá una animación flotante. Los otros controles están ahí para cuando quieras ser más creativo. Aprendes sobre la marcha.
¿puedo utilizar estas rotaciones 3D en el móvil?
El efecto visual funcionará, pero no es un entorno 3D “verdadero”. Simula la rotación 3D mediante CSS, compatible con todos los navegadores móviles modernos. Se verá genial, pero para 3D intenso, necesitarías una herramienta diferente. Para los efectos de inclinación y giro para los que está diseñado, es perfecto.
¿cuál es un buen uso en el mundo real para la Escala X y la Escala Y separadas?
Imagínese un botón “Notificarme”. Podrías usar la escala Y para que baje rápidamente (dando retroalimentación táctil) y luego vuelva a la normalidad. O, para un reproductor de música, un gráfico de ondas sonoras podría usar la escala Y de forma independiente en cada barra para que se mueva al ritmo.
¿el uso de muchos de estos efectos en una página perjudicará el rendimiento?
Si te excedes, sí, como cualquier cosa. Aplicar entre 10 y 20 animaciones complejas diferentes a una docena de elementos puede provocar un tirón en dispositivos más lentos. La clave es la sutileza. Utilice 1-2 efectos primarios por sección. Un flotador suave y una ligera rotación es todo lo que normalmente necesita para lograr un efecto profesional y animado.
Widgets y extensiones de Elementor de tendencia
Cree sitios web sofisticados en menos tiempo.
Vidriomorfismo
Extras de contenedores
Patrones
Duplicador de publicaciones/páginas
