Show element only when NOT scrolling

Hi there Webflow community,

I have a problem with the following, and I’m not figuring it out since I’m not good with Javascript. Below in the screen I added a scroll button and I would like it to only show when the page is not scrolled. So when it is scrolled it needs to disappear. Working with the native animations of Webflow does not get me the desired effect. Does anybody know how to do this?

In a previous thread this was somehow explained, but I do not understand where to implement the code they used: Show element when NOT scrolling

If there is a native way to do this in Webflow, would also be great.

Website: pharaoil.webflow.io

Thanks so much!


Here is my public share link: https://preview.webflow.com/preview/pharaoil?utm_medium=preview_link&utm_source=designer&utm_content=pharaoil&preview=202c010c5a7f76f39019e64b9ae5d39f&workflow=preview)

Hi,

Post the read only link.

Hi there,

It’s at the bottom of my question!

Charles

Hey,

Yeah just add “While Page is Scrolling” to the body, targeting the “Mouse-Wrapper” div. I just tried 30 & 70, but you can move them up or down.

See ya,
G.J.

Hey :slight_smile:

Thanks so much for your help, but this doesn’t get the desired effect, right? I would like that when the page is not scrolling, the mouse shows, and when it is scrolling it disappears. This animation just says that at 70% the mouse becomes invisible, but if people stop scrolling at 75% percent for example (or wherever at that matter) it needs to become visible again. How do I achieve that?

Thanks
Charles

Are you trying to sync the mouse icon with the content change? Or just when they stop scrolling altogether?

If so, this will need custom code. Probably can be done with simple JavaScript snippet.