Pinning an element causes it to disappear on scroll trigger ending.

[bdlowery]

I want the aside element to imitate what the position: sticky property does, but with a little lerp (which is why the y property is there).
I was able to get the pin to work like position: sticky, but as soon as I added the y property the pinned item now disappears once the scroll trigger ends.

Is there a way to fix this?

See the Pen jOvbLyR by bdlowery (@bdlowery) on CodePen

[GreenSock]

Excellent job creating a minimal demo, @bdlowery! Super helpful. 💚

 

Welcome to the forums. 

 

The problem is that you're animating the transform of the same element that you're pinning. That's almost never a good idea because in order to do the pinning properly, it has to apply a transform at the end but your animation is messing with that. The best way to handle it is to just wrap your element in a container; pin the container and animate the child. 

 

See the Pen xxawXvm?editors=1010 by GreenSock (@GreenSock) on CodePen

 

Does that help?