Interaction extension · Pro

Elementor Sticky Element and GSAP Pin: Hold Sections on Scroll

Hold a hero while the next section slides over it, or pause a statement for a screen of scrolling. Sticky adds a GSAP pin to Elementor 4 containers, so any Elementor sticky section holds between start and end points you choose.

Get Animation Addons Pro Try it free

Flexbox, Div Block and Grid
15 start and end presets, or type your own
Pin Spacing: hold the page or let content slide over
On or off per breakpoint

Need a plain sticky header or sidebar? Elementor 4's own Style › Position › Sticky is free and does that well.

Animation Addons 4.3Updated October 2026

The short answer

What is Sticky?

Sticky is an Animation Addons Pro extension for Elementor 4 that pins a Flexbox, Div Block or Grid between two scroll points using a GSAP pin. Pin Start, Pin End and Pin Spacing decide when the Elementor sticky element holds and whether the next section waits or slides over it, with separate values for every breakpoint.

Also searched as: elementor sticky element, elementor sticky section, elementor sticky on scroll, elementor pin section, elementor stacking cards, stacked panels in elementor, elementor sticky not working, elementor sticky hero, elementor position sticky, gsap pin for elementor, sticky in elementor 4, elementor sticky container, elementor sticky scroll effect

Key factsAnimation Addons 4.3

Sticky key facts
Plan	Pro
Type	Interaction (scroll)
Works on	Elementor 4 Flexbox, Div Block and Grid only. To pin a heading, image or button, wrap it in a Div Block.
Main controls	Enable Sticky, Pin Start, Pin End, Pin Spacing, Pin Markers, Enable On Editor; advanced: Pin Trigger, Pin End Trigger, Pin, Toggle Class, Border, Background Color
Engine	GSAP; the runtime ships in Animation Addons Pro
Editor preview	Off by default. Enable On Editor runs the pin on the canvas and adds a Play button.
Limits	Containers only. Without an active Pro licence, settings save but nothing pins. Pin Markers applies to all devices. Elementor 4.0+.
Plugin version	Animation Addons for Elementor 4.3 · Last updated October 2026

Demo variations

Six ways to use Sticky.

Every demo is built with Sticky from Animation Addons Pro on Elementor 4's own elements. The settings on each card are a good place to start.

Every demo pins the container itself, with Pin Trigger, Pin End Trigger and Pin left on Default. Full-screen panels use Min Height 100vh; a section that slides over a pinned one gets a solid background, Position Relative and Z-index 1 in Elementor's Style tab.

Larchwood CabinsCabinsPricesFind usCheck dates

Sleep above the treeline

Six timber cabins, a wood stove in each, and no neighbours.

Choose your cabin

**The Larch**Sleeps 2, from £165 a night

**The Rowan**Sleeps 4, from £230 a night

**The Hearth**Sleeps 6, from £310 a night

Two-night minimum at weekends. Dogs welcome in The Rowan.

Cabin hero that the next section slides over

The hero is a 100vh Flexbox with Sticky on; the cabins Flexbox below covers it. Set Pin Start to Top Top, Pin End to Bottom Top and Pin Spacing to False.

Palmer Quay StudioBrand and web, Bristol

Strategy

We start by finding out what your customers already say about you, then decide what to change and what to keep.

Identity

A name, a logo and a few rules, delivered as a one-page guide your whole team can follow.

Websites

Built on Elementor, handed over with a short video so you can edit it yourself.

Start with a free 30-minute call: [email protected]

Three service panels that stack as you scroll

Elementor stacking cards, or stacked panels in Elementor: three 100vh Flexbox panels with Sticky on the first two. Set Pin Start to Top Top, Pin End to Bottom Top, Pin Spacing to False and Z-index to 1, 2 and 3 so each lands on top.

A one-line promise that holds for a moment

A 100vh Div Block holding a Heading. Set Pin Start to Top Top, Pin End to Bottom Top and Pin Spacing to True, so the next section waits.

Corner LoafBakery and cafe, Hebden Bridge

The Saturday box

Every Saturday we bake a box for collection from 8am. It sells out by Thursday night, so order early.

Two sourdough loaves, four seeded rolls and a slab of whatever cake is in the oven. Nothing is frozen and nothing is made the day before.

You can swap the cake for a dozen cinnamon buns. Tell us about allergies when you order and we will pack the box separately.

Collection is from the side door on Market Street. We hold boxes until 1pm.

This SaturdaySaturday sourdough box2 loaves, 4 rolls, 1 cake slab£14Order by Thursday 6pm

Corner Loaf, 3 Market Street. Open Wednesday to Sunday, 7am to 3pm.

Order card that stays in view while the text scrolls past

A Div Block card with a Heading, a Paragraph and a Button. Set Pin Start to Center Center, Pin End to Bottom Top and Pin Spacing to True.

Dental practice tour panel that holds on desktop

A 100vh Flexbox with the free Background Video extension (a slow zoom on a still photo stands in for the video here). Set Pin Start to Top Top, Pin End to Bottom Top and Pin Spacing to True, with Enable Sticky off at tablet and mobile.

Tidemark Review 2025Coastal Housing Trust, annual report

Chapter 1

Homes we built

In 2025 the Trust completed 212 homes across four towns, 148 of them for social rent. Median build time fell from 19 months to 14.

The Harbour Steps scheme opened in March with 64 homes and a ground-floor community kitchen run by residents.

Every new home meets a minimum energy rating of B, and 90 per cent have a heat pump.

Chapter 2

People we housed

1,340 households moved into a Trust home this year. The average wait for a two-bedroom home was 11 months.

We kept 96 per cent of tenancies going past the first year, up from 91 per cent in 2023.

Our repairs team completed 93 per cent of urgent jobs within 24 hours.

Annual report with chapter openers the text slides over

A 100vh Grid per opener, with the title over an image and Sticky on, and the chapter text in the Flexbox below. Set Pin Start to Top Top, Pin End to Bottom Top and Pin Spacing to False.

Features

What you get with Sticky.

Every point below is a real control in the Sticky panel section or part of how it works, from a simple Elementor sticky on scroll hold to stacked panels. Nothing here needs custom code.

Pick the exact moment it pins

Pin Start takes a position pair: a point on your element, then a point on the screen. Top Top pins when the element's top reaches the screen's top; Center Center pins it mid-screen. Pick from 15 presets or type your own.

Decide when it lets go

Pin End uses the same pairs. Bottom Top keeps a full-screen panel pinned for one screen of scrolling.

Hold the page, or let content slide over

Pin Spacing True makes the next section wait until the pin ends. False lets it scroll straight over the pinned one, the cover effect in demos 1, 2 and 6, an Elementor sticky scroll effect many designers ask for.

Tune it by eye, per device

Pin Markers draws the start and end lines on the page. Enable Sticky, Pin Start, Pin End and Pin Spacing each take a value per breakpoint, so a pin can run on desktop only.

Advanced options

Pin Trigger, Pin End Trigger and Pin switch from Default to Custom to name another element. The Style tab adds Toggle Class, Border and Background Color.

Step by step

How to add Sticky in Elementor 4

Six steps from switching it on to publishing. The bold names are the exact labels you will see on screen.

Get Animation Addons Pro

In WordPress, open Animation Addon › Settings › Extensions and check that Sticky is on.
In Elementor 4, select the Flexbox, Div Block or Grid for your Elementor pin section. For a full-screen panel, set its Min Height to 100vh in the Style tab.
Open the Sticky/Pin Element section and turn on Enable Sticky.
Set Pin Start and Pin End, choose Pin Spacing, and turn on Pin Markers.
Turn on Enable On Editor, press Play and adjust until the markers sit where you want.
Switch Enable Sticky off on breakpoints that shouldn't pin, turn Pin Markers off, and publish.

Honest comparison

Position Sticky vs a GSAP pin

Elementor position sticky is a free Style › Position › Sticky option in Elementor 4, with a Top or Bottom offset and Z-index. It keeps an element on screen within its parent container: exactly right for sticky headers and sidebars. Animation Addons Sticky is for scroll moments, holding a whole section between two scroll points.

Elementor sticky element options: Position Sticky vs a GSAP pin
Need	Elementor 4 Position: Sticky	Animation Addons Sticky
Plan	Free, in the Style tab	Animation Addons Pro
How long it stays	Until it reaches the edge of its parent container	Between the Pin Start and Pin End points you set
Where it starts	A Top or Bottom offset	Element-and-screen pairs (Top Top, Center Center, Top 80px…)
Make the next section wait	No setting	Pin Spacing True or False
See start and end on the page	No	Pin Markers
Engine	CSS position: sticky	GSAP

Compared with Elementor 4.3.3 (September 2026).

Which one to pick

Elementor Pro's Interactions add a "While scrolling" trigger but no pin, so Sticky complements them.

Who it's for

Who uses Sticky?

The people who get the most out of it, and what they use it for.

Agencies
Building stacked panels and hero reveals for clients.
Hotels and travel brands
Holding a hero photo while content arrives.
Publishers
Structuring long reads with chapter openers.

FAQ

Questions about Sticky

How do I make an element sticky in Elementor 4?

For a sticky header or sidebar, use Elementor's free Style › Position › Sticky. To hold a section between two scroll points, select a Flexbox, Div Block or Grid, open the Sticky/Pin Element section, turn on Enable Sticky and set Pin Start and Pin End. Animation Addons Sticky is part of Animation Addons Pro.

GSAP pin or CSS sticky: what is the difference?

CSS sticky keeps an element in view only until it reaches its parent's edge. A GSAP pin for Elementor, which Animation Addons Sticky uses, holds the element between start and end scroll points you define and can make the page wait with Pin Spacing. Use CSS sticky for headers and sidebars, a pin for scroll moments.

How do I make the next section slide over my hero?

For an Elementor sticky hero, give it a Min Height of 100vh, enable Animation Addons Sticky on it, and set Pin Start to Top Top, Pin End to Bottom Top and Pin Spacing to False. The hero holds while the next section scrolls over it; give that section a solid background, Position Relative and Z-index 1 so it covers the hero.

Which elements can I pin?

Animation Addons Sticky makes an Elementor sticky container out of a Flexbox, Div Block or Grid, and appears only on those three; wrap a single heading, image or button in a Div Block to pin it. It needs Elementor 4.0 or later and an active Animation Addons Pro licence. Without Pro, the settings save but nothing pins on the live page.

Can I see the pin while editing?

Yes, when you ask for it. Animation Addons Sticky does not run on the editor canvas by default, so editing stays calm. Turn on Enable On Editor to run the pin in the editor with a Play button, and Pin Markers to see the start and end lines while you adjust.

Can I turn Sticky off on phones?

Yes. In Animation Addons Sticky, Enable Sticky is set per breakpoint, so you can pin on desktop and switch it off at tablet or mobile. Pin Start, Pin End and Pin Spacing also vary per breakpoint. Pin Markers is one setting for all devices, so turn it off before publishing.

Will it conflict with Elementor's own sticky?

Use one method per element. If a container already has Elementor's Position set to Sticky, reset it before enabling Animation Addons Sticky, so CSS sticky and the GSAP pin are not both holding it. A page can still use Elementor's sticky header and Animation Addons Sticky on other sections.

Does Sticky slow my page or affect SEO?

Animation Addons loads an effect's scripts on the pages that use it, and Pro adds Lazy Animation, Reduced Motion and a Performance Wizard. Animation Addons Sticky only changes where a section sits while scrolling; text and links stay in the HTML, so search engines read the page as before.

Why is my Elementor sticky not working?

Check that Enable Sticky is on, that the element is a Flexbox, Div Block or Grid, and that Elementor's own Position Sticky is not also set on it. Turn on Pin Markers to see the start and end lines. Playback on the live site needs Animation Addons Pro, and the editor only shows the pin when Enable On Editor is on.

More answers in the FAQ · Documentation · Free vs Pro

Pairs well with

Related extensions and elements

What works well with Sticky on the same page or template.

See all 29 extensions Browse the Atomic Elements

Animation Addons Pro · Elementor 4

Hold the moment, then let the page move on.

For a sticky header, Elementor 4's free Position › Sticky works well; upgrade for pins with their own start and end.