Streaming live at 10am (PST)

Marquee Text Scrolling Speed Gets Faster w/ Scrolling

Hey all. I know how to setup a marquee animation on websites, but does anyone by chance know how to setup an animation that speeds up the marquee scrolling whenever the user begins scrolling (and it slows down to the normal speed whenever the user stops scrolling)? I swear I’ve seen this on one of the sites posted in here, but I can’t seem to find it anywhere.

So to recap the animation would work as follows:
Interaction #1: [User enters website]
Marquee is scrolling slowly in background

Interaction #2: [User begins scrolling downward]
Marquee speeds up in one direction

Interaction #3: [User stops scrolling]
Marquee slows down to normal speed of scrolling

Interaction #4: [User begins scrolling upward]
Marquee scrolling reverses it’s direction and begins to speed up in the opposite direction

Interaction #5: [User stops scrolling upward]
Marquee begins to slow down to the normal scrolling speed in the new direction

So in essence the marquee speed and direction is directly influenced by the scrolling direction and speed of the user.

Any help here would be greatly appreciated.

Thank you!


Here is my public share link:
https://preview.webflow.com/preview/portfolio-f9d3a3?utm_medium=preview_link&utm_source=designer&utm_content=portfolio-f9d3a3&preview=325d9594cb61b4343296af8b798be0dd&mode=preview

Also how can I center my marquee text within their containers? lol. It’s as if there is a margin beneath the letters that is causing them to pop-upwards and take up the top 2/3 of the container (and even extend beyond the top, as well). This could impact the clickability experience of these letters that I plan to implement later on. I’m guessing this is an easy fix, but I’m a bit of a n00b. lol.