mrztms

Hi @Rodrigo Thank you for taking the time to reponds and mentioning Observer Plugin, I know there are a lot of questions in the forum. You're example is excatly what I was asking and looking for, so this is much appreciated. However I forgot to add one more detail, that what if you have content after your canvas animation? My thought process is you have a hero section with your product animation but after that you have new sections describing a product or just regular content you miss the animation since the scroll takes you down the page. The canvas animation playing nicely when beeing on fixed position, in the current example. I have forked your demo, and added some dummy content under it. If this is out of scope of the forum I totally understand, I just feel this maybe will help others that are looking to achieve something similar. https://codepen.io/tamasmoroz/pen/xxzPRqY

Hi! I'm building a website for a client using ScrollTrigger and similar approach as the Airpods example from Codepen. In the Airpod example the animation ( frames ) are played using the scroll, my question is how can one add start to sections of the animations using just one scroll. Using the airdpod example what I would like to achieve is: - 1 scroll => animation plays from frame 0 to frame 40 then stops, - another scroll animation plays from 41 to 100, - another scroll from 100 to 148. So I would have 3 animation sections which would start to play with one scroll each. Haven't added my example to codepen since it's very similar to the Airdpod example, if I could get some ideas or which GSAP plugin to use in combination with scroll trigger, woudl be much appreciated. Thank you!