Hey everyone, Cosmic Steve here.
Just rolled out a new plugin for native mobile apps that I think many of you will find useful. It’s called the Scrolling Position & Visibility Tracker, and it’s designed to solve a common problem on mobile: knowing where the user is on the page.
It’s a 2-in-1 tool that lets you get the page’s scroll position and also detect when an element becomes visible.
Main features
Scrolling Position Tracking: Get a continuous numeric value of the page’s vertical and horizontal scroll position. It’s perfect for creating scroll-based animations, parallax effects, or showing a reading progress bar.
Viewport Detection: Get events when the element enters or exits the visible screen area (‘Entered Viewport’ & ‘Exited Viewport’). This is super handy for lazy loading content or triggering actions at just the right moment.
Exposed States: Outputs ‘Scrolling Position Y’, ‘Scrolling Position X’, and ‘Is Visible’ for you to use directly in your conditions and expressions.
Lightweight & Easy: It’s a simple, invisible element by default, but there’s a ‘Debug Mode’ to make it visible, which helps to confirm it’s on the page.
Check out the PLUGIN PAGE
Check out the DEMO PAGE
Check out the EDITOR PAGE
How does it work
Since Bubble’s native engine doesn’t give us a direct Current page scrolling position like on the web, this plugin provides the solution. You just add the ‘Advanced Scroll Tracker’ element anywhere on your page – it’s an invisible box. From that point on, it will continuously output the page’s scroll distance in the ‘Scrolling Position Y’ state. As the user scrolls down the page, this number will increase from 0. It’s that simple.
At the same time, the element also checks if it’s currently inside the visible part of the screen and triggers the ‘Entered Viewport’ or ‘Exited Viewport’ events when its status changes. This makes it a great all-in-one tool for scroll-aware apps.
Check out the PLUGIN PAGE
Check out the DEMO PAGE
Check out the EDITOR PAGE
Hope you find this useful for your native projects!
Get more & save big with the Mobile Pack!
This plugin is also available as part of the big native mobile pack, which includes a bunch of other tools for building native apps.
Check out the Mobile Pack: Native Power Kit now!
Cheers, Steve