Animation extension · Pro
Wipe a photo in from one edge, slice it into shutters, assemble it from tiles or zoom it through a tunnel, on Elementor 4 Image and SVG elements.
Need something free today? Elementor's own Interactions can fade, slide or scale an image as it scrolls into view.
The short answer
Image Animation is an Animation Addons for Elementor extension that adds Elementor image reveal animation to Elementor 4 Image and SVG elements. It offers edge wipes, scale-ins, a full-width stretch and eight cinematic presets such as Slice Shutter and Mosaic Depth, triggered on scroll, on load, with the scrollbar, on hover or on click.
| Plan | Pro |
|---|---|
| Type | Animation |
| Works on | Elementor Image and SVG; Animation Addons Post Image |
| Effects | Reveal, Scale, Stretch; cinematic presets pro - 1. Cinematic Mask, pro - 2. Scale Animation, pro - 3. Slice Shutter, pro - 4. Mosaic Depth, pro - 5. Liquid Clip, pro - 6. 3D Orbit Tilt, pro - 7. Zoom Tunnel, pro - 8. Scroll Parallax; Regular Animation's presets; Custom Animation |
| Main controls | Animation, Trigger, Animation To, Start Scale / End Scale, Direction, Slice Count, Tile Columns / Tile Rows, 3D Depth, Light Sweep, Delay, Duration, Ease, Start / End, Markers |
| Triggers | On Page Load, On Scroll, Play With Scroll, On Click, On Hover, On Slide Change |
| Engine | GSAP with ScrollTrigger |
| Editor preview | No auto-replay while you edit; a play button on each interaction row runs that one animation |
| Limits | Only on the three image elements listed; for an image inside another widget or a background image, animate its container with Regular Animation. One page-load or scroll interaction per element (hover and click unlimited). Playback needs Animation Addons Pro |
| Plugin version | Animation Addons for Elementor 4.3 · Last updated October 2026 |
Demo variations
Every demo uses Image Animation from Animation Addons Pro on Elementor 4's own elements. The settings on each card are a good place to start.
A full-width project photo that opens as 14 vertical strips, alternating up and down, with a slight skew.
Portrait photos in a two-column Grid; each assembles from scattered, rotating tiles that settle into the full image.
Post thumbnails in a Loop Grid wipe in from the left as each card arrives.
A close-up product photo that zooms out to its full frame through a widening circle, tied to the scrollbar.
A rounded, inset dining-room photo widens to full width and squares its corners on scroll.
A team photo rises through a wavy edge as a soft blur clears.
Features
Every point below is a real control in the Image Animation panel section or part of how it works. Nothing here needs custom code.
The cinematic presets slice, tile, tilt and mask the image itself. Picking one fills tuned defaults, such as Slice Count 14 for Slice Shutter, and the panel shows only the settings that preset uses.
Reveal wipes the image in from the edge you choose in Animation To. Scale grows it from Start Scale to End Scale inside its frame. Stretch widens a narrower image to full width and squares its corners.
The pro - 8. Scroll Parallax preset moves the photo within its frame as the page scrolls, with Parallax Direction, Frame Distance (px) and Image Distance (%), a look the element-level Parallax extension doesn't cover.
Choose Custom Animation, or one of Regular Animation's presets, to set Method and From Properties / To Properties yourself. Every interaction saves per breakpoint, so a heavy Mosaic Depth on desktop can become a simple Reveal on mobile.
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, and check Image Animation is on in the plugin dashboard's extension list.
Open a page in the Elementor 4 editor and select an Image or SVG element.
In the Image Animation section, click Add Interaction.
Pick an effect in Animation, such as Reveal or "pro - 3. Slice Shutter", and a Trigger.
Adjust the effect's settings, Duration and Ease, then press the row's play button to preview.
Check tablet and mobile, simplify if needed, and 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 Image Animation |
|---|---|---|
| Image-specific reveals (wipe, slices, tiles, mask) | Not in the effect list | Reveal plus 8 cinematic presets |
| Effects | Fade, Slide, Scale (Free); Custom effect in Pro | Built-ins, cinematic presets and Custom Animation |
| Scroll-scrubbed playback | "While scrolling" in Pro only | Play With Scroll on every effect |
| Hover and click triggers | Pro only | Included |
| Different settings per device | Pro only | Yes, per breakpoint |
Compared with Elementor 4.3.3 (September 2026).
Elementor's free Interactions handle a basic fade or scale on an image well. Image Animation is for reveals that cut, tile or mask the picture itself.
Who it's for
The people who get the most out of it, and what they use it for.
Presenting case studies where the photo is the story.
Adding drama to product heroes.
Who want calm reveals across a whole archive from one Loop Item template.
FAQ
With Animation Addons, select an Elementor 4 Image, open the Image Animation section and click Add Interaction. Choose Reveal and set Animation To for the edge the wipe starts from, or pick a cinematic preset such as pro - 3. Slice Shutter. Set the Trigger to On Scroll and press the row's play button to preview the image reveal.
Animation Addons Image Animation appears on Elementor 4's Image and SVG elements and on the Animation Addons Post Image element, not on other widgets or background images. To reveal a whole card or a container with a background image, use Regular Animation's Clip-Path Unmask or Mask Reveal Up presets on the container.
Yes. Animation Addons Image Animation works on Elementor 4's Image and SVG elements, which ship with Elementor Free, so you don't need Elementor Pro. You need Elementor 4.0 or newer and Animation Addons Pro. Without Pro, Elementor's free Interactions can still fade, slide or scale an image as it scrolls into view.
Animation Addons Image Animation does not replay while you change settings. Each interaction row has its own play button that runs that one image animation on the canvas, and hover and click rows respond in the editor too. For scroll rows, switch on Markers to see the start and end lines, then turn it off before publishing.
Yes. In Animation Addons Image Animation, choose the Scale effect with Start Scale and End Scale, or the Zoom Tunnel preset, and set the Trigger to Play With Scroll. The image then zooms in step with the scrollbar and reverses when visitors scroll back. Use Start and End to set where the zoom begins and ends.
Image Animation from Animation Addons doesn't replace your image; Elementor still outputs a normal image tag with its alt text, so search engines see it as usual. The effect script loads only on pages where an image animation is set. Presets like Mosaic Depth and Slice Shutter split the image into many pieces, so keep them to a few hero images per page.
Yes. Animation Addons Image Animation works on the Post Image element, so you add it once to the Loop Item template of a Loop Grid and every post thumbnail animates as it scrolls into view. A simple Reveal suits long archives better than heavier cinematic presets.
Animation Addons Image Animation keeps the image and its alt text in the HTML, so screen readers describe it as normal. Animation Addons Pro includes a Reduced Motion setting in its performance tools. For accessible pages, prefer Reveal or Scale over fast 3D presets and keep durations near one second.
More answers in the FAQ · Documentation · Free vs Pro
Pairs well with
What works well with Image Animation on the same page or template.
Reveal containers, cards and background-image sections that Image Animation doesn't attach to.
Move the whole image element at its own speed after it reveals.
Match the photo reveal with a headline reveal.
The featured-image element that takes Image Animation inside Loop Grids.
Wipes, shutters, tiles and tunnels for Elementor 4 Image and SVG elements, on scroll or tied to the scrollbar.
Starting free? Elementor's Interactions can fade or scale an image in as it scrolls into view.
