---
title: "How to Add a Parallax Background in Elementor?"
url: https://theplusaddons.com/docs/add-a-parallax-background-in-elementor/
date: 2025-01-10
modified: 2026-09-14
lang: en
author: "Aditya Sharma"
description: "A parallax background moves the image at a different pace from the content, which adds depth while visitors scroll. The Row Background widget from The Plus Addons for Elementor turns..."
image: https://theplusaddons.com/wp-content/uploads/2025/01/How-to-Add-a-Parallax-Background-in-Elementor_-1024x536.jpg
word_count: 558
---

# How to Add a Parallax Background in Elementor?

## 

- The Plus Addons for Elementor Row Background widget turns a background image into a scroll parallax, a mouse-tilt image, or a slow Ken-Burns zoom.
- Row Background is available only in The Plus Addons for Elementor Pro, and it is enabled under The Plus Addons > Widgets before being dropped into a container or classic section.
- Magic Scroll moves the image only after the container passes the middle of the screen, and a Final (Y) of -50 moves the image 25 px down in the test.

A parallax background moves the image at a different pace from the content, which adds depth while visitors scroll.

The **Row Background** widget from The Plus Addons for Elementor turns a background image into a scroll parallax, a mouse-tilt image or a slow Ken-Burns zoom.

*To check the complete feature overview documentation of The Plus Addons for Elementor Row Background widget, [click here](https://theplusaddons.com/docs/create-a-multi-layer-elementor-background/).*

***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/section-background/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — the Row Background widget is only available in The Plus Addons for Elementor Pro.- **Widget to enable:** Row Background, switched on under **The Plus Addons > Widgets**.- **Where to put it:** drop the widget inside the container (or classic section) that should get the background. It draws nothing of its own; the background fills that container.

## Steps

- Add the Row Background widget to the container and open **Content > Deep Layer**.- Set **Select Option** to **Creative Background Image** and choose the picture in **Background Image**. Adjust **Image Position**, **Attachment**, **Repeat** and **Background Size** if needed.

![The Background Image of a Creative Background Image deep layer](https://theplusaddons.com/wp-content/uploads/2026/09/rowbg-image-background.webp)

- Keep **Background Effect** on **Normal Background Image**. Optional: pick **Parallax Tilt Effect** or **Parallax Move Effect** in **Special Image Hover Effects** to move the image with the mouse.

![The Background Effect and Special Image Hover Effects dropdowns](https://theplusaddons.com/wp-content/uploads/2026/09/rowbg-image-effect.webp)

- Turn on **Scroll Parallax** for the scrolling effect.

![The Scroll Parallax switch of the background image](https://theplusaddons.com/wp-content/uploads/2026/09/rowbg-image-scroll-parallax.webp)

- Optional: turn on **Ken-Burns Effect** for a slow zoom, and **Responsive Image** to use other images on tablets and phones.

![The Ken-Burns Effect switch with Effect Direction and Effect Duration settings](https://theplusaddons.com/wp-content/uploads/2026/09/rowbg-image-kenburns.webp)

The recording below shows these steps in the editor, followed by a short demo of the result.

![Setting up a parallax background image in the Row Background widget](https://theplusaddons.com/wp-content/uploads/2025/01/row-background-creative-background-image.gif)

## Settings

| Setting | What it does | Default |
| ------- | ------------ | ------- |
| **Attachment** | **Fixed** keeps the image still while the page scrolls past it. | Scroll |
| **Background Effect** | Normal Background Image or Auto Moving Background Image. | Normal Background Image |
| **Special Image Hover Effects** | Parallax Tilt Effect or Parallax Move Effect, with **Intensity Parallax** (20 to 100). | Select Style (none) |
| **Scroll Parallax** | Moves the image vertically while the container scrolls through the screen. | Off |
| **Magic Scroll** | Moves the image between an Initial and a Final position while scrolling. | Off |
| **Ken-Burns Effect** | Slow zoom, **Effect Direction** Normal or Alternate, **Effect Duration(Speed)** in seconds. | Off, 15 |
| **Responsive Image** | Separate images in the Tablet and Mobile tabs. | Off |

## How It Behaves

- **Scroll Parallax**: the image position moved from about 35% to 80% from top to bottom as the container scrolled up the screen.- **Attachment Fixed**: the image stayed still and the container acted like a window onto it.- **Parallax Tilt Effect** tilts and **Parallax Move Effect** shifts the image as the mouse moves; both ease back over three seconds when the mouse leaves.- **Ken-Burns Effect** with a 6-second duration zoomed the image to about 127% and started again.- **Responsive Image**: a 1024 px screen still showed the desktop image, 800 px and 767 px the tablet image, 390 px the mobile image.- **Magic Scroll** only moves the image after the top of the container passes the middle of the screen; a container at the very top of the page is already past that point.

![Published container with a scroll parallax background image](https://theplusaddons.com/wp-content/uploads/2026/09/rowbg-result-image-parallax.webp)

## Limitations

- Magic Scroll moves the image half the distance you enter, in the opposite direction: a Final (Y) of -50 moved the image 25 px down in our test.

## Troubleshooting

### Magic Scroll does nothing

The container is probably at the top of the page. The movement runs while the container scrolls past the middle of the screen, so it shows best on sections further down.

## Related Docs

- [Row Background widget: settings overview](https://theplusaddons.com/docs/create-a-multi-layer-elementor-background/)- [Add a background image scrolling effect](https://theplusaddons.com/docs/add-background-image-scrolling-effect-in-elementor/)- [Add a moving image background](https://theplusaddons.com/docs/add-a-moving-image-background-in-elementor/)

## Frequently Asked Questions

**Q: Why is my parallax background not moving in Elementor?**
A: The most common reason is that the container is sitting at the top of the page. Magic Scroll only starts moving while the container passes the middle of the screen, so a section placed too high can look like nothing is happening. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH uses that scroll position to trigger the effect, so sections further down the page show it more clearly.

**Q: What do I need before adding a parallax background in Elementor?**
A: The Row Background widget has to be available in The Plus Addons for Elementor Pro, and it must be installed and activated. The widget also needs to be switched on under The Plus Addons > Widgets before it can be used inside a container or classic section. It does not create its own visible block, because the background fills the container you place it in.

**Q: Can I use a parallax background inside a container or classic section?**
A: The Row Background widget is meant to sit inside either a container or a classic section, and it turns that area into the background holder. That matters because the widget itself draws nothing on its own. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH uses the parent container as the visible surface for scroll parallax, mouse tilt, or Ken-Burns motion.

**Q: What is the best way to make a background image move with scrolling in Elementor?**
A: Scroll Parallax is the cleanest option when you want the image to drift vertically as the section moves through the viewport. In this setup, Attachment Fixed keeps the image still while content scrolls past it, which creates that window-like depth effect. If you want more motion, Magic Scroll moves between an Initial and Final position instead of just staying fixed.

**Q: How does Magic Scroll behave in The Plus Addons for Elementor?**
A: Magic Scroll only starts once the top of the container has passed the middle of the screen, so timing matters more than with a fixed background. It also moves only half the distance you enter and in the opposite direction. In one test, a Final (Y) of -50 moved the image 25 px down, which is easy to miss if you expect full-distance movement.

**Q: What are good settings for a parallax background with mouse movement?**
A: Parallax Tilt Effect and Parallax Move Effect are best when you want subtle cursor-driven motion instead of scroll-based movement. Both sit under Special Image Hover Effects, and their Intensity Parallax runs from 20 to 100. They also ease back over three seconds after the mouse leaves, so they feel less abrupt than a hard snap back.