[ScrollTrigger within a Scene]

Hi There,
 

I'm new to Greensock and ScrollMagic, so I'm struggling with something I'm attempting to do and would appreciate some guidance.

Below is what I currently have:

https://codepen.io/Submission12/pen/WNagjYz

 

I'm trying to implement this:

See the Pen rNOebyo by GreenSock (@GreenSock) on CodePen

when a user scrolls to Section 2. I'd like to show each element within scene2 with the scrollTrigger animation and then only scroll to scene3.
 

<section id="scene2" class="panel turqoise">
  <div class="box">
    This is Section 2
  </div>
  <div class="element1">This is Section 2a</div>
  <div class="element2">This is Section 2b</div>
  <div class="element3">This is Section 2c</div>
  <div class="element4">This is Section 2d</div>
</section>

 

Thank you!

 

 

See the Pen WNagjYz by Submission12 (@Submission12) on CodePen

[Slide in Directions]

Thanks Cassie, I appreciate the response to this.

I have been through a few tutorial videos and I'm currently stuck.

I created a minimal demo:

See the Pen GRyVYRO by CodeKnightTGC (@CodeKnightTGC) on CodePen

 

I just need to figure out how to get the left blocks to slide down instead of up when I scroll.

 

[Slide in Directions]

Hi,

 

I'm new to GSAP and I've been going through the CodePen examples to try and replicate this site (https://redlight.dev/) slide animations.

 

OnScoll down I want to be able to slide each side in different directions to reveal.

 

Thanks