tholeb
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by tholeb
-
-
Hello, i'm trying to do build the same video/image sequence style of the Airpods website and also add text. I googled and found this awesome codepen posted in the GSAP forum (see end of post):
I'd like to have something like this codepen (scroll after panel 5) :
See the Pen bGexQpq?editors=0010 by GreenSock (@GreenSock) on CodePen
But I really don't know how I can do something like this (add a sort of duration maybe ? Or even "scroll-out" when there is no text left to show ?)
Here is an example when I try to simply add another div (see screenshot) : you can see that the canvas is still "playing" (the scroll duration comes from the window height not the canvas height/parent height), and also that is goes way beyond the div.So, my question is: how can I make it so it does not goes beyond the div, and that the canvas duration is related to the div size (after div, the canvas is not changing).
Also, I'm doing my website with React, and found this npm package : https://www.npmjs.com/package/react-gsap Do you recommend to use it, or should I stick with "basic" gsap ?
Thank you .See the Pen yLOVJxd by GreenSock (@GreenSock) on CodePen
Airpods video/image sequence scroll and text
in GSAP
Posted
Hello, thanks a lot for your answer, i'll have a look to the video and the trigger element, I think that's the thing that can solve my problem.