---
title: "How to Add Image Sequence on the Page Body in Elementor?"
url: https://theplusaddons.com/docs/add-image-sequence-on-page-body-in-elementor/
date: 2023-05-09
modified: 2026-09-19
lang: en
author: "Aditya Sharma"
description: "Sometimes the animation should not be boxed into one section — it should sit behind the whole page while the content scrolls over it. Apply To > Body in the..."
image: https://theplusaddons.com/wp-content/uploads/2023/05/How-to-Add-Image-Sequence-on-the-Page-Body-in-Elementor_-1024x536.jpg
word_count: 651
---

# How to Add Image Sequence on the Page Body in Elementor?

## 

- Scroll Sequence widget applies Apply To > Body, so the frames draw behind the whole page and advance as the visitor scrolls the page itself.
- The Plus Addons for Elementor Pro ships the Scroll Sequence widget only in Pro, and the widget disappears from the page when the Pro plugin is switched off.
- Scroll Sequence accepts a numbered set of images in JPG, PNG, or WebP, and the post says 30 to 60 frames is a practical range for smoother animation.
- Body mode requires content z-index above the sequence, with the widget’s Style tab z-index left at 0 and visible widgets set to 1 or higher on the Advanced tab.

Sometimes the animation should not be boxed into one section — it should sit behind the whole page while the content scrolls over it.

**Apply To > Body** in the **Scroll Sequence** widget does that. The frames are drawn behind everything on the page and step forward as the visitor scrolls the page itself.

*To check the complete feature overview documentation of The Plus Addons for Elementor Scroll Sequence widget, [click here](https://theplusaddons.com/docs/scroll-sequence-elementor-widget-settings-overview/).*

***Requirement - This widget is a part of The Plus Addons for Elementor Pro, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/image-scroll-sequence/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — the **Scroll Sequence** widget ships only in The Plus Addons for Elementor Pro. With the Pro plugin switched off the widget's output disappears from the page entirely.- **Widget to enable:** **Scroll Sequence**, under **The Plus Addons > Widgets**. Search for it and turn the toggle on.- **Prerequisite:** a numbered set of images, one per frame. JPG, PNG and WebP are the formats the widget offers. More frames means a smoother animation and a heavier page — 30 to 60 frames is a practical range.- **Prerequisite:** a page long enough to scroll. In Body mode the whole page is the sequence's track, so a short page plays the frames almost instantly.

## Set it up

- Add a section or container anywhere on the page and drop the **Scroll Sequence** widget into it. In Body mode it does not matter where the widget sits — the frames are drawn behind the page, not in that section.- Set **Apply To** to **Body**.- Choose your frames: **Gallery** from the media library, or **Remote Server** for a folder of files.- Leave the widget's own **Z-Index**, on the **Style** tab, at its default of **0**.- Give every widget you want visible a higher **Z-Index** on its **Advanced** tab — 1 or more is enough.

![The Scroll Sequence panel with the Apply To dropdown open](https://theplusaddons.com/wp-content/uploads/2026/09/scrollsequence-apply-to.webp)

> *The rule is simply that your content's z-index must be above the sequence's. Either lower the sequence or raise the content; what matters is the difference, not the exact numbers.*

## How It Behaves

The frames are drawn in a layer pinned to the top of the window, behind the page. Scrolling the page steps through them. Measured on a 40-frame sequence, the visible frame was 5, 15, 24 and 34 at four points down the page:

![A page whose own headings scroll over frame 18 of a 40-frame body sequence](https://theplusaddons.com/wp-content/uploads/2026/09/scrollsequence-result-body.webp)

![A page body scroll sequence playing behind the page content](https://theplusaddons.com/wp-content/uploads/2023/05/scroll-sequence-body-demo.gif)

- The whole page is the track, so how far you have scrolled the page is how far through the sequence you are.- Anything with a transparent background will show the frames through it. Give your content sections a solid or semi-transparent background if you want the text readable.- Only use one Body sequence per page. Two would both try to draw behind the same page.

## Limitations

- The frame layer is inserted at the very top of the page body, so a theme element that also pins itself there can end up fighting it for position.- A short page burns through the whole sequence in a few scrolls. Body mode suits long pages.- Because the sequence sits behind everything, anything with an opaque background hides it completely for that part of the page.- **Preload Image (%)** did not change how many frames were fetched on the first load in our tests.

## Troubleshooting

### The frames cover the whole page and hide the content

Your content has no z-index of its own. Set **Z-Index** on those widgets or containers, on the **Advanced** tab, to 1 or higher.

### Nothing shows behind the page

Check that **Apply To** is on **Body** and that images are selected. With no images the widget prints **No Image Selected!** where it sits instead.

### The sequence finishes before the page does

That is expected when the page is much longer than the number of frames. Add frames, or use **Apply To > Default** in one tall section instead.

## Related Docs

- [Scroll Sequence Elementor Widget Settings Overview](https://theplusaddons.com/docs/scroll-sequence-elementor-widget-settings-overview/)- [How to Add Image Sequence in Inner Column in Elementor?](https://theplusaddons.com/docs/add-image-sequence-in-inner-column-in-elementor/)- [How to Add Sticky Sections in an Image Scroll Sequence?](https://theplusaddons.com/docs/add-sticky-sections-in-image-scroll-sequence/)

## Frequently Asked Questions

**Q: What do I need before adding an image sequence behind the whole page in Elementor?**
A: The Scroll Sequence widget in The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH is a Pro-only feature, so the Pro plugin has to be installed and activated or the output disappears. It also needs a numbered image set, one frame per image, in JPG, PNG, or WebP. Body mode works best on a long page because the whole page becomes the track for the animation.

**Q: How do I make an image sequence sit behind the page content instead of inside one section?**
A: Set Apply To to Body in the Scroll Sequence widget. That moves the frames into a layer behind the entire page, so scrolling the page itself advances the sequence. The widget can sit anywhere on the page in this mode because its position in the section does not control where the frames appear.

**Q: Why is my page content hidden by the image sequence?**
A: That usually means your content does not have a higher z-index than the sequence. The widget’s own Z-Index stays at its default of 0 on the Style tab, while visible widgets and containers need a higher value on Advanced, with 1 or more being enough. This matters because Body mode draws the frames behind everything on the page, so stacking order decides what stays readable.

**Q: Why does nothing show behind my page when I use Body mode?**
A: Body mode only works when Apply To is set to Body and images are actually selected. If no images are chosen, the widget shows No Image Selected! where it sits instead of rendering a sequence. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH uses that setup to place frames behind the page rather than inside a single container.

**Q: Is Body mode better for short pages or long pages?**
A: Long pages are the better fit. In Body mode, the whole page becomes the track for the sequence, so a short page can burn through all frames in just a few scrolls. The tutorial notes that 30 to 60 frames is a practical range and that more frames make motion smoother but also heavier.

**Q: Can I use more than one body image sequence on the same page?**
A: Only one Body sequence should be used per page. Two sequences would both try to draw behind the same page and fight for control of that shared layer. If you need another effect on a specific section instead of the whole page, [Scroll Sequence Elementor Widget Settings Overview](https://theplusaddons.com/docs/scroll-sequence-elementor-widget-settings-overview/) and related docs like [How to Add Image Sequence in Inner Column in Elementor?](https://theplusaddons.com/docs/add-image-sequence-in-inner-column-in-elementor/) point to other layouts.