ChrisCrossCrash

That's great, @ZachSaucier!!

I've just made it a bit more "fluid" looking by changing the ease on the const scrub animation from power1.inOut to power3.out.

In addition, I've added a "Stationary Text" element as a stationary reference.

This had me stumped for most of the day yesterday. I'm sure I'll be using this on many of my projects from here on out! Thanks!

See the Pen mdVjLVv?editors=1010 by ChrisCrossCrash (@ChrisCrossCrash) on CodePen

Hello 😄 First time poster here.

I'm trying to mimic the scrolling behavior of this site, where the text's vertical position lags behind the scroll position.

The effect is most obvious in the navigation menu (click the hamburger icon in the top left). You'll notice that if you scroll down quickly to the bottom of the page, it takes about two seconds for the text to catch up to the scroll position.

This looks like something I could use ScrollTrigger for. In the the docs page video at about 9:50, you can see that the orange box lags the .ghost box by one second when it has the setting scrub: 1. This is the behavior I want, except it should animate the text's vertical position on the screen.

The problem is that, unlike with the horizontal position, the vertical position of the element in the DOM doesn't change -- only the scroll position changes.

Any ideas how I can achieve this effect?