MARKETPLACE
PLUGINS
SCROLL TO ELEMENT
Scroll to Element logo

Scroll to Element

Published April 2025
   •    Updated this month

Plugin details

Scroll to Element adds an Element Scroll instance to your page, enabling you to jump any scrollable container to a target element—either instantly or with smooth animation—and easily return to your previous position. It captures both page and container scroll positions as exposed states, and provides Scroll to Element and Scroll Back workflow actions plus Scroll to Element Complete and Scroll Back Complete workflow event triggers so you always know when scrolling starts and ends.

Free

For everyone

stars   •   0 ratings
22 installs  
This plugin does not collect or track your personal data.

Other actions

Platform

Web

Contributor details

Boston85719 logo
Boston85719
Joined 2018   •   13 Plugins
View contributor profile

Instructions

Documentation Link: https://helix-warrior-4f9.notion.site/Scroll-to-Element-Plugin-Docs-1dde670f23ed80a5bca6d88bbd63f34b
1. Place the Element Scroll instance onto your page where you need programmatic scrolling. No other elements are required—this instance works entirely via its workflow actions.


2. Configure the instance’s fields

Set the Target Element ID to the DOM ID of the element you want to bring into view, and the Parent Container ID to the DOM ID of the scrollable container. Optionally enter an Animation Duration (ms) for a smooth scroll, and a Vertical Offset (px) to fine‑tune the final position.


3. Snapshot initial scroll positions

When you run Scroll to Element for the first time, the plugin automatically publishes your current scroll positions as Current Page Position and Current Parent Position. You don’t need to configure anything extra—these states update behind the scenes.


4. Trigger the scroll

In any workflow, add the Scroll to Element workflow action. This will scroll your container to the target element (plus offset), using smooth animation if you set a duration. The action fires the Scroll to Element Complete workflow event trigger when finished.


5. Chain follow‑up logic

Add a “When Scroll to Element Complete” workflow event trigger to run post‑scroll actions—such as highlighting the new section, loading additional data, or recording an analytics event.


6. Return to the original position

To bring users back, create another workflow and add the Scroll Back workflow action. This instantly returns the container to the previously captured Current Parent Position and fires the Scroll Back Complete workflow event trigger.


7. Optional cleanup

If you need to clear stored positions before a new scroll sequence, use the Clear Positions workflow action. This resets both Current Page Position and Current Parent Position to empty (null), giving you a fresh slate.


8. Build richer UX flows

Combine these steps to create guided tours, error‑focus jumps, or promotion reveals. By leveraging the built‑in states and event triggers, you can orchestrate complex scroll‑driven interactions without any custom code.

Types

This plugin can be found under the following types:
Element   •   Event   •   Action

Categories

This plugin can be found under the following categories:
Mobile   •   Analytics   •   Technical   •   Containers   •   Visual Elements

Resources

Support contact
Tutorial
Forum

Rating and reviews

No reviews yet

This plugin has not received any reviews.
Bubble