How to scroll to the top of the page, from the footer?

[Billy44]

Hi all,

I have a logo in the footer (reusable element) of my application.
I would like to create a workflow so that when we click on that logo, we scroll to the top of the page, but Bubble doesn’t allow to scroll to other elements that elements that are inside the footer. Is there any way to make it scroll to the top of the page ?

Thanks a lot !

Billy

[viquarahmed07]

Hi @Billy44
You can do that using “Run Javascript”

First you have to enable “expose HTML ID” from settings section “General” Tab

Then you need to install “Toolbox” plugin from plugins section

Then add ID to group to where you want to scroll (mostly first group in the page)

Then in Footer when logo is clicked Run javascript like this

Maybe there are other ways too
But for me this worked

[darren.james7518]

Can you do it with a backned workflow? When you click the logo you trigger a backend workflow which scrolls to the top?

[Billy44]

Thanks a lot for your detailed answer !

For some reasons, it doesn’t seem to work on my side. I tried to run the same javascript code with different group ID from the header / homepage but nothing happens when I click

[viquarahmed07]

@Billy44 I am not sure why its not working for you
this HeaderBufferGroup id is on your home page?
Try to add to add some extra groups in your home page (in order to reach the end you have to scroll)
For me it doesn’t work when i have entire page fits in large screen without scrolling…

[adamhholmes]

If you just want to scroll to the top of the page you can always just use: window.scrollTo(0,0)

[Billy44]

I succeed to make in work with an element within the homepage, thank you very much Actually, when I refered to an ID within the Header, it didn’t work

[Billy44]

Works very well, thank you Adam !