Templates Plugins Courses

๐Ÿ‘€ Element Viewport Detector - New Plugin from Zeroqode

Element Viewport Detector - This smart plugin will trigger an event once a certain element enters userโ€™s viewport. This should help you better understand user behavior in your app, such as number of times a certain element/group/page has been viewed (including individual cells in repeating groups) or also trigger certain workflows and UX interactions when you know that user has seen a particular part of your app.


For details, screenshots and demos please visit the plugin page at Element Viewport Detection Plugin for Bubble | Plugin for Bubble by Zeroqode

If you have questions about this plugin or need any help, please reach out through Zeroqode Forum at https://forum.zeroqode.com

Levon Terteryan

Founder @ Zeroqode & Bubblewits


Bubble Templates
Bubble Plugins
Bubble Courses
Convert Web to iOS & Android
No-code Development Services

Does this work with horizontally scrolled repeating group cells?

@levon could you please confirm

Hi, @userar!

Apologies for the slow reply :pray:

We have fixed the bug in the plugin related to the horizontal scrolling and updated it. Please have a look at Live Demo: https://zeroqode-demo-08.bubbleapps.io/element_viewport.

Now it works with horizontal scrolling :slightly_smiling_face:

Happy holidays! :tada:
Best, Julia.

Can this do the opposite? Trigger an event when an element exits the userโ€™s viewport?

Iโ€™ve got a single page app with a video player. If a user starts playing a video and then navigates to a different section of the single page app the video player continues to play (because itโ€™s on the same page and only hidden).

I want that video to be paused. If I can trigger a workflow when the video element is no longer in the viewport I could accomplish this (I have a workflow action for pause). I just need to figure out the trigger part. Could this provide the trigger?
So Iโ€™m looking for something

Hi, @tjc4!

Thanks for reaching out!

Unfortunately, this is not possible to implement through this plugin. Apologies for the inconvenience. I suppose you can implement this through the JS. Or as a workaround, here is one more way that can be helpful. Set the Condition: do when condition is true- Current page scrolling position > 300 trigger the Pause action.

Hope this will help you!
Best, Julia.

The trigger doesnโ€™t seem consistent. I am using this is a repeating group and its trigger is infrequent. What triggers it and why might it not be working?

Hi @robert3, thanks for reaching out, and sorry for the delayed reply.

Weโ€™ve tried to describe how it works into the plugin element field documentation:

To be able to help you, would it be convenient to share a screencast with your use case flow and plugin setup?
It would allow us to identify any possible issue much faster.

Looking forward to your reply.


Take a look at this screen capture

Hi @robert3, thanks for the provided screencast.
Weโ€™ve tried to reproduce the same logic on our side (trigger a workflow after each X RG element scroll) and it worked properly.
Please see and use for reference the following setup example: zeroqode-demo-08 | Bubble Editor

In case after rework the issue will persist, please let me know :pray:


@Serg Here is the workflow for mine

Do you think the multiple conditions are a problem?

Here is the element itself.

Do you think the pixel only being 1x1 is a problem?

The group only shows in the repeating group when this condition is met

Would having the viewport detector in a group that is shown and hidden a problem?

Can you try and replicate similarly? How you have it set up is not the same. I want the group to only appear is certain conditions are met. This is a social media feed so it had 4 groups with conditions.

  1. Shows when the post is an image
  2. shows when the post is a video
  3. shows when the post is a share (repost)
  4. shows an ad (every 3 posts - this is the group that has the viewport detector element in it)

@Serg ok, I think Iโ€™ve narrowed it down to being an issue when the repeating group is not set to โ€œfull listโ€. If you use vertical scrolling or ext. scrolling it doesnโ€™t trigger consistently.

Can you look into this?


Hi @robert3, thanks for your reply and sorry for the delay from our side.
Allow us to check the provided information and provide a feedback asap.

Thank you for understanding.


Thank you. This is a critical element of the app, so I appreciate it.


Hi @Serg

Any updates from your side?

Hi @robert3,
Iโ€™m afraid that so far there are no preliminary timelines for the investigation.
Once the developer team will share the investigation results, I will let you know asap.

Thank you for understanding :pray:


Hi @robert3, thank you for your patience.

We have pushed a plugin update, that has fixed the issue related to triggering events on scrolling.

To check changes, please upgrade your plugin to the latest version (Version 1.6.0: added possibility to bind scroll event to repeating group id) and give it a try.

On setup, please be sure to consider the following notice:

Please let me know if there is any other plugin-related questions that I can help with.


Still not working consistently. Can you show me a demo of it working?

Hi @robert3, please see the following demo pages:


Does this plugin not work within a popup?