A static section reads like a flat image. Give it a gentle, looping drift and the same element feels alive. The Floating Effects extension in Master Addons for Elementor adds that continuous motion to any element, no keyframes or custom CSS to write. This guide explains what the extension does, what you can animate, and how to apply it.
What Is the Floating Effects Extension? #
The Floating Effects extension is a Master Addons for Elementor motion tool that adds a continuous, looping animation to any Elementor element, section, column, or widget. It animates the element with translate, rotate, and scale transforms, and lets you control the duration, delay, and direction of the movement. Because the effect is CSS-based, the element keeps drifting on its own without a heavy JavaScript animation library.
What You Can Animate #
Floating Effects works through three transform types, and you combine them with timing controls to shape the motion:
- Translate — moves the element along the X or Y axis, the classic up-and-down or side-to-side float.
- Rotate — turns the element slightly back and forth for a gentle sway.
- Scale — grows and shrinks the element for a soft pulsing effect.
- Duration, Delay, and Direction — set how long one cycle takes, how long to wait before it starts, and which way the motion runs, so the animation matches the pace of the section.
How to Add Floating Effects in Elementor #
Floating Effects is applied per element from the Elementor editor, once the extension is enabled in Master Addons. In short: select the element you want to animate, open its settings, turn on Floating Effects, and choose a transform with its timing.
- Make sure Master Addons for Elementor is installed and active, and that the Floating Effects extension is enabled in the Master Addons panel.
- In the Elementor editor, select the section, column, or widget you want to animate.
- Open the element’s settings and find the Master Addons Floating Effects controls, then switch the effect on.
- Pick a transform — Translate, Rotate, or Scale — and set the duration, delay, and direction.
- Preview or publish the page to see the element drift on the live site.
Tips for Using Floating Effects #
- Keep the motion subtle. A small translate distance and a slow duration read as polished; large, fast movement looks distracting.
- Use it on one or two elements per view. A single floating hero image or icon draws the eye; a whole page in motion competes with itself.
- Pair it with entrance motion. Combine Floating Effects with the Entrance Animation extension so an element eases in first, then keeps its gentle float.
- Check it on mobile. Confirm the movement still looks good on smaller screens and does not push nearby content around.
Frequently Asked Questions #
What is the Floating Effects extension in Master Addons?
Floating Effects is a Master Addons for Elementor motion extension that adds a continuous, looping animation to any Elementor element. It uses translate, rotate, and scale transforms and lets you control the duration, delay, and direction of the movement, all without writing custom CSS or keyframes.
What kinds of animation can Floating Effects create?
It supports three transform types: translate to move an element up and down or side to side, rotate for a gentle back-and-forth sway, and scale for a soft pulsing effect. You can combine a transform with timing settings to shape the exact motion you want.
Can I control the speed and direction of the floating animation?
Yes. Each effect exposes duration, delay, and direction controls. Duration sets how long one cycle takes, delay sets how long to wait before the motion starts, and direction sets which way the animation runs, so you can match the float to the pace of the section.
Does Floating Effects work on any Elementor element?
Yes. The extension applies to Elementor sections, columns, and widgets, so you can float an image, an icon, a heading, a button, or an entire section. You enable it per element from the Elementor editor once the extension is switched on in the Master Addons panel.
Will floating animations slow down my website?
The effect is CSS-based, so it is lightweight compared with heavy JavaScript animation libraries. To keep pages smooth, use it on just one or two elements per view and keep the movement subtle rather than animating everything on the page at once.
