Animation extension · Pro
Pick one of 22 GSAP presets, choose when it plays (scroll, page load, hover, click or with the scrollbar) and set it per device, on the Elementor 4 elements you already use.
Need something free today? Elementor's own Interactions fade, slide or scale an element on page load or when it scrolls into view.
The short answer
Regular Animation is an Animation Addons for Elementor extension that adds Elementor scroll animation and GSAP entrance animations to Elementor 4 Atomic Elements. Each element gets an Interactions list: pick one of 22 presets or build a custom animation, choose a trigger such as On Scroll or On Hover, and set it per breakpoint.
| Plan | Pro |
|---|---|
| Type | Animation |
| Works on | Elementor Heading, Paragraph, Button, Image, SVG, Flexbox, Div Block and Grid, plus Animation Addons atomic widgets such as Loop Grid, Nav, Counter and Nested Slider parts |
| Main controls | Animation (22 presets or --- Custom Animations ---), Method, Trigger, Trigger Selector, Wrapper, Start, End, Delay, Duration, Ease, From Properties / To Properties, Markers |
| Triggers | On Scroll, On Page Load, Play With Scroll, On Hover, On Click, On Slide Change |
| Engine | GSAP with ScrollTrigger |
| Editor preview | No auto-replay while you edit: the play button on each interaction row runs that one animation on the canvas |
| Limits | One page-load and one scroll interaction per element (hover and click unlimited). Not on Elementor's YouTube, Video, Divider, Tabs, Accordion or Background Video; wrap them in a Div Block. Playback needs Animation Addons Pro |
| Plugin version | Animation Addons for Elementor 4.3 · Last updated October 2026 |
Demo variations
Every demo uses Regular Animation from Animation Addons Pro on Elementor 4's own elements. The settings on each card are a good place to start.
The headline fades up on load; the dashboard screenshot rises into place on scroll.
Three cards on a dark Grid; the middle one scales in with an indigo glow that fades.
Product photos on cream drift up while colour returns from grayscale.
Cards pop in on scroll; pointing at one makes it hop up and settle back.
y: -8, repeat: 1, yoyo: true.The product photo opens out of a rounded frame as the visitor scrolls, and reverses on the way back.
Features
Every point below is a real control in the Regular Animation panel section or part of how it works. Nothing here needs custom code.
Choosing a preset such as "2. Blur Reveal (Apple Style)" fills From Properties and To Properties with its values, so you can nudge one number instead of starting from zero.
Choose --- Custom Animations --- and add properties from a grouped list: transforms, opacity, filter, clipPath, colours, borders, box shadow, typography, SVG stroke and fill, plus repeat and yoyo. Method offers From, To, From To and Set.
Stack a scroll entrance, a hover state and a click response on the same element. Trigger Selector lets a hover or click somewhere else, such as a button, start the animation.
Start and End accept positions like "top 85%". Set Wrapper to Custom to time against other elements with Start Trigger and End Trigger; Markers shows the lines while you tune.
Step by step
Six steps from switching it on to publishing. The bold names are the exact labels you will see on screen.
Get Animation Addons ProInstall Animation Addons for Elementor and Animation Addons Pro; check Regular Animation is on in the plugin dashboard.
Open a page in the Elementor 4 editor and select an element, such as a Heading or Flexbox.
In the element's Animation section, click Add Interaction.
Pick a preset in Animation and a Trigger (On Scroll for an entrance).
Adjust Delay, Duration and Ease, then press the row's play button to preview.
Switch to tablet and mobile to change or remove the interaction there, then publish.
Honest comparison
What each option has, side by side. Where the other choice is the better fit, we say so.
| Feature | Elementor 4 Interactions | Animation Addons Regular Animation |
|---|---|---|
| Entrance effects | Fade, Slide, Scale (Free); Custom effect in Pro | 22 named presets plus Custom |
| Triggers | Page load, Scroll into view (Free); Scroll out, While scrolling, Hover, Click (Pro) | On Page Load, On Scroll, Play With Scroll, On Hover, On Click, On Slide Change |
| Easing | easeIn only (Free); six more in Pro | Eight GSAP eases, including Bounce, Elastic and Expo |
| Animatable properties | Opacity, scale, move, rotate, skew (Pro custom effect) | 75, including filter, clipPath, colours and box shadow |
| Different settings per device | Pro only | Yes, per breakpoint |
| Engine | Motion library | GSAP with ScrollTrigger |
Compared with Elementor 4.3.3 (September 2026).
Elementor's free Interactions handle a simple fade well. Choose Regular Animation for a specific look, hover and click without Elementor Pro, or different motion on mobile.
Who it's for
The people who get the most out of it, and what they use it for.
Shipping polished launches on Elementor Free sites without hand-written GSAP.
Matching a Figma or Awwwards reference.
Presenting screenshots and pricing cards.
FAQ
With Animation Addons Pro, select an Elementor 4 element, open its Animation section and click Add Interaction. Regular Animation lets you pick one of 22 GSAP presets such as Classic Fade Up, set the Trigger to On Scroll and preview it with the row's play button. Hover, click and scroll-scrubbed animations work the same way.
Yes. Animation Addons Regular Animation works on Elementor 4 Atomic Elements, which ship in Elementor Free, so hover, click and scroll-linked triggers need no Elementor Pro. You need Elementor 4.0 or newer and Animation Addons Pro. On a free-only site the Animation section shows a Try link; the animations themselves play once Pro is active.
Elementor's own free Interactions fade, slide or scale an element on page load or when it scrolls into view. That covers a basic entrance. Animation Addons Regular Animation adds the 22 GSAP presets, hover and click triggers, scroll-scrubbed playback and per-device setups, and needs Animation Addons Pro. Start with Interactions and upgrade when a design needs more.
Yes. The Regular Animation Interactions list in Animation Addons is saved per breakpoint. Switch Elementor's device preview to mobile and remove the interaction, or swap a 3D preset for a simple fade, and desktop keeps its animation. Elementor's own Interactions only allow per-device settings with Elementor Pro.
Animation Addons Regular Animation does not replay while you change settings. Each interaction row has its own play button that runs that one animation on the canvas, and hover and click interactions respond in the editor. For scroll interactions, turn on Markers to see the start and end lines, then switch it off before publishing.
Regular Animation runs on GSAP, and most presets animate transform, opacity and filter. Animation Addons Pro adds Lazy Animation, a Performance Wizard and LiteSpeed Cache and WP Rocket compatibility. Animation Addons leaves your content in the page HTML, so search engines still read it. Animate the elements that matter rather than every paragraph.
Use one system per element. Elementor's Interactions and Animation Addons Regular Animation both animate opacity and transform, so running both on one element gives unpredictable results. Keep Elementor's Interactions for simple fades and use Regular Animation where you need presets, hover states or per-device control.
Animation Addons Regular Animation appears on Elementor's Heading, Paragraph, Button, Image, SVG, Flexbox, Div Block and Grid, and on Animation Addons atomic widgets. Elementor's YouTube, Video, Divider, Tabs, Accordion and Background Video elements don't get it. Place one inside a Div Block and animate the Div Block instead.
More answers in the FAQ · Documentation · Free vs Pro
Pairs well with
What works well with Regular Animation on the same page or template.
22 GSAP presets, hover and click triggers and per-device control on elements you already use.
Starting free? Elementor's Interactions cover a basic fade or slide; upgrade when you need more.