Elementor Split Scroll Design

Elementor Split Scroll Design

Table of Contents

In this tutorial, I will show you how to replicate this "split scroll" design, where sticky images on one side, are "reverse scrolling" as content on the other side is scrolling normally.

See the demo here:

Features:

  • Works with sections & columns, or containers
  • Works with any amount of images
  • Works with the normal "Image element", so it's lazy-load compatible
  • Works on desktop and tablet (could work on mobile too, however it's not ideal due to the narrow viewport)
  • Performant animation
  • No JS dependencies

Let's get started!

First, import the template on the page where you want this

It's easier to start from the template for this tutorial.

Choose the template that you want, you have the choice between the "Container" version, or the "Section" version.

This is a premium tutorial. Purchase access to unlock the full tutorial and download the template.

 

Looking for something else? Search across 2445 Elements right here:

And get exclusive Elementor related discounts here

Checkout the Elementor Addon Finder directly

Comments

Leave a Reply