Joseph L

@Rodrigo - thanks a ton for the detailed response. The text scrolling definitely works better on your demos than mine. I will use this as a foundation on my next try. Getting the video to synchronize correctly is the next step. I'll post back here if I find the right solution. Take care, Joseph

@Rodrigo - as mentioned before. Your demo seems to break the synchronization. text section1 and video num1 should be synced together, 2-2, 3-3, etc. I understand my code isn't the cleanest it could be, but my main issue was getting these sections to synchronize while having different animations. I had to revert back to my original code because yours was not achieving this. Like I said, the trick with onLeaveBack and onLeave works great for the videos, however! If there's a way to achieve this with the text it would be wonderful. Thank you for your time. Edit: The sync issue is within your Codepen as well, upon a second look. I can't quite figure out how to sync them when forking yours. It becomes even more apparent if you edit the settings for the text transitions to be more fluid and closer to my original animations. I am sure I am missing something simple here! d1sections.forEach((section, i) => { const previous = d1sections[i - 1]; if (previous) { tl.from( section, { y: 700, opacity: 0 }, "+=1.5" ).to( previous, { y: -20, opacity: 0 }, "<" ); } });

Rodrigo, thank you for your reply. Unfortunately, your changes to the text throw the syncing of the text to video off. It is odd because it works in your codepen. The moment I fork it, it no longer syncs. [Edit: this seems to still be synced incorrectly on the Codepen upon a second look] I have applied the single onLeaveBack and onLeave, but kept the text section close to the same. New codpen: https://codepen.io/jl-ni/pen/xxejMpb If you have any idea how I could make it so that section 1 shows up initially like the video, and also to have section 4 stay visible without disappearing at the end. I would be most appreciative.

Hey all, I have been using the forum resources and demos to help build the linked GSAP/Scrolltrigger section. It's pretty straightforward in objective, but I can't get it to enter and exit how I want and was hoping someone could take a look at my code and let me know if there's a solution. I have 4 sections or "slides" Patented copy + motionless video 1 2.) Unrivaled copy + video 2 3.) Meticulous copy + video 3 4.) 70% copy + video 4 Each video plays and pauses when it is finished, waiting for the scroll to trigger the next section and "continue" playing the video (by playing the next video). My goal: a.) Scroll into this section and have slide #1 be default, so you do not need to scroll past a blank section to get to it. b.) Once slide 4 appears, I would like the user to be able to scroll away from this section without, instead, scrolling to a blank space before being allowed to continue. bonus goal: remove the flashing fade transition between videos I'm sure I have made some grave mistakes with this code, and am looking to this community for a fresh set of eyes. Any help is appreciated. Thank you! Joseph