Scroll To An Element - Bug? Workaround?

Hi all,

I have spent hours to try and figure out what I could be doing wrong and finally have concluded that scroll to and element is broken. No matter how much I fiddle with it, I cannot get it to consistently scroll to the top of the element I have specified. And yes!!! I have accounted for my floating header. There was a post about this back in Nov’23 but have not seen much about it seen, which seems weird because it is a pretty critical function.

@jasonjwadsworth @dorilama - did this get fixed three months ago and it is just now broken again, or has Bubble really left this unfixed for three months?

1.) Is anyone else experiencing this issue?
Please confirm that you have accounted for any floating group headers as these can cause some confusion.

2.) Does anyone have an elegant work around?

3.) Can anyone tell me if there is a list of known bugs somewhere that can save me the time of determining through experimentation that my problem is a bug in Bubble and not me missing the plot?

Working on a Video to add to a bug report that I will post shortly but if anyone has any thing to brighter my day, please chime in asap.

Thanks

Hi Kevin,

I’m not certain if you’re encountering the same issue, but in the project I’m currently engaged with, I faced a problem where attempting to scroll to a specific element would only bring it to the middle of the viewport. For instance, aiming to scroll to the very top of the page, I’d select the element at the top, yet the scroll action would halt at the element’s midpoint, failing to reach the top as intended.

To address this, I adjusted the Offset (pixels) value to -888 (though, any sufficiently large number should suffice, depending on the height of the element, it doesn’t necessarily have to be -888). This tweak effectively resolved the scrolling issue for me.

I’m not entirely sure if this is the solution you’re seeking, but I hope it proves helpful to you!

Hi @Bruno_Duarte,
Thanks for your response. How on earth did you come up with the fix?
I will test it out and let you know.
The one fear I have is that it won’t work with my Floating Header as I need to set the off-set to account for the space the banner takes up.
Cheers,
K

The specific issue we had in November last year was resolved. I double checked my sites, and it appears to be working as intedended. I also have a floating header on one of my sites.

I am not sure if this might have something to do with the issue you are facing… but what kinds of elements are you trying to scroll to? I have only attempted to structure my sites scrolling to a group element. I have not played around with scrolling to buttons, shapes, inputs, etc.

I spent a full day trying to figure out how to fix it, and as I use sometimes negative numbers on my designs depeding of what I building, just tried like that !

As I said, it worked for me, not sure if it’s the best aproach !

Hi @jasonjwadsworth,
Thanks for the response.
Happy to hear that you are not having issues!
Will keep my fingers crossed that my issue will not persist.
re. elements that I am just scrolling to. I just scroll to group elements.
Cheers,
K

@Bruno_Duarte ,

I tried your approach but it just took me to the top of the page.

I have got a sort of work around that is similar to yours in which I do two successive scroll to’s - one to the top of the page and another to the element I am targeting (with the correct off-set) but the bouncing up and down makes me feel sick watching it, and I like roller coasters, so I am worried that many users will find this fix …nauseating.

Thanks again for the input.

Cheers,

K

the bug in the topic linked was about the scroll action throwing an error and blocking the workflow. If your action scroll, but not on the right point probably is an unrelated issue.

thanks @dorilama and apologies for the lag in following up on your response.

It turns out that my issue was the Responsive Tester in Firefox. It does not scroll to properly but when I take it out of responsive mode, the scroll to works.

To all,

It turned out that my issue was not a bubble bug but an issue with the Firefox in the Responsive Design Tester Mode. When I tried to test the scroll to with the Responsive Design Tester Mode on, the scroll to would not scroll to where I wanted.

However, as soon as I turned Responsive Tester Mode off, it worked like a charm.

1 Like

This topic was automatically closed after 14 days. New replies are no longer allowed.