Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Looped "Scrolling" Section Transitions - ScrollTrigger

Recommended Posts

Plz help!
I'm trying to animate a page with multiple sections.
1. header (height:100vh)
2. ScrollTrigger(Looped "Scrolling" Section Transitions)
3. footer(height:100vh)

See the Pen zYzjvpE by minhcodefactory (@minhcodefactory) on CodePen

Link to comment
Share on other sites

Hi quocminh3707, welcome to the GSAP forums!

I'm afraid I've read your questions and I don't quite understand what you're aiming for.


If you have a looped scrolling section with a footer afterwards you would never reach the footer.

Could you explain what you're trying to achieve and explain what you've tried?


Link to comment
Share on other sites

Oh ok I get you!

No looping. ☺️

Here you go - you need to adjust the styling and markup a little to get this right.

You'll also need to pin the container for the duration so that you get that 'fixed' effect before scrolling on to the footer.

See the Pen wvejoZR?editors=0010 by GreenSock (@GreenSock) on CodePen

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.