ayank007

Thanks again. Actually I tried for a demo, but the demo is working fine. And as you suggest, I will try it with GSAP Context. I hope it will work then.

Thanks for the tip, let me try to be more specific one more time. You can see the markers "start" and "end", are not vertically aligned with the component I am applying animation to. Thus the component suddenly shift to some pixel bottom, before starting the animation. But when I change route couple of time, the markers automatically get aliened perfectly. In the codepen demo, It works perfectly. Hope you got my problem.

I am building react project with GSAP. I am trying to create an animated div that will scale up based on scroll. My animation works perfectly on codepen demo. But when implementing it in my project, it sets the markers wrongly. But when I change routes, and come back, the markers automatically get set perfectly. Please watch the video for better understanding, or go to this link https://ayank007.github.io/newportfolio/# Source code: https://github.com/ayank007/newportfolio/blob/master/src/components/Work/index.tsx in line 37 Can anyone please help me, what went wrong. Thank you. Untitled.mp4

Thanks man, I swear it wasn;t working on first try

Thanks, The demo is working for just "elastic". What can I do to config like "elastic.out(1, 0.3)"?

Gsap is accepting Power1/Power2 as easing effect for the mouse follower but not accepting elastic easing.