Free

Scroll Indicator Demo

Scroll progress indicator — scroll this page to see it in action.

What it does

Scroll progress indicator — scroll this page to see it in action.

This free widget ships with LandTech Extras for Elementor on WordPress.org. Drag it from the LandTech Extras category in the Elementor panel and match the settings shown in the live demo.

Live demo

Part 1 — Start

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Scroll to see the indicator track this section.

Part 2 — Middle

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Keep scrolling — the active item and progress ring should update.

Part 3 — End

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

Final section — indicator should mark this block as read when you reach the bottom.

How to implement

  1. Open any page in Elementor.
  2. Search for the widget used on this demo page under LandTech Extras.
  3. Configure the controls to match the live demo section above.
  4. Update and preview on the frontend.