Floating Effects Module

The Elementor Floating Effects Module is an innovative component seamlessly integrated into our plugin. Its purpose is to enhance your website elements with captivating and visually appealing animations. This module empowers you to effortlessly generate a variety of eye-catching effects, encompassing smooth transitions, rotations, scaling, and opacity changes.

Benefits of Using a Floating Effects

  1. Attention-Grabbing Visuals: Floating effects draw attention to specific elements on a webpage, making them stand out and capturing the user’s focus.
  2. Enhanced User Engagement: Dynamic animations create an interactive and engaging browsing experience, encouraging users to explore the content further.
  3. Adaptability: Floating effects can be tailored to suit various types of websites, from business pages to portfolios, allowing for versatility in design.

Steps of adding Floating Effects

Make sure you have installed and activated HT Mega Pro to access all the features of this module.

Step 1: How to Enable Floating Effects Module?

Go to WordPress Dashboard > HTMega Addons> Settings > Modules. From the list of Modules, Enable the “Floating Effects” Module.

After turning on the Floating Effects Switcher, just click the “Save Settings” button to save your changes easily.

Step 2: How to Add the Floating Effects

Once you’ve enabled the Floating Effects module in the module settings, access the Elementor editor for your chosen page. Choose the element to which you wish to apply the Floating Effect. Head to the Advanced tab within the Elementor settings panel. Locate the “HTMega Floating Effects” section and toggle the switch to enable the feature and customize the desired effect.

floating effects

Step 3: Available Effects

The module provides various effects, encompassing Motion, Styles, and Filters, among others.

floating effects features
Motion Effects

By enabling the Motion effect, you can incorporate Translate, Rotate, Scale, and Skew effects to create your desired animations.

floating motion effect
Style Effects

Enabling the Style effect allows you to integrate element Opacity and element Background Color effects, enabling you to craft your preferred animations.

Floating style effects
Filters Effects

By enabling the Filters effect, you can integrate element Blur, Contrast, Grayscale, Hue, Brightness, and Saturation effects, giving you the flexibility to create your desired animations.

Step 4: How to Customize Floating Effects

Customize each effect according to your preferences using options like Duration, Delay, Axis, Value, and more. Explore these settings to attain the visual impact you desire.

General Settings

In the general settings, customize the animation’s direction, loop, and easing.

  • Direction: Choose the direction setting as Normal, Reverse, or Alternate to define the animation’s flow.
  • Loop: Set the loop to either Infinity or a custom number in the loop settings.
  • Easing: Define the easing effect from options such as Linear, easeInOutSine, easeInOutExpo, easeInOutQuart, easeInOutCirc, easeInOutBack, Steps, Elastic In, Elastic Out, or Elastic In Out.
floating effects

Was this helpful?

Good job! Please give your positive feedback

How could we improve this post? Please Help us.

Scroll to Top