[Using scrolltrigger to control lottie file AND fade in text blocks?]

Thanks @Rodrigo that helped with the doubling up, thank you!

 

My other question would be how do I now link the text I want to fade in/out to the same timeline that the lottie animation is using?

 

I've looked at other examples that do something similar, but then the lottie file doesn't load but the text animation works.

[Using scrolltrigger to control lottie file AND fade in text blocks?]

Hey all,

 

What I'm trying to do:

• Use scrolltrigger to control the progress of the lottie file
• Use scroll trigger to fade in text blocks sequentially, then fade the text block up and out at defined times on the timeline

 

What's happening:

 

• Even though I set the text to not be visible initially it still all appears.
• Can't properly link the animation of the lottie and text. Can't seem to get the text to fade out using stackblitz (but it fades out one by one locally 🫠)

 

Any assistance greatly appreciated

 

Minimal demo: https://stackblitz.com/edit/react-fra2qi?embed=1&file=src%2FApp.js