Jump to content


Scrolling Image Sequence with GSAP

Moderator Tag

Recommended Posts

Hey there,
i'am trying to do something like this Scrolling Image Sequence, but i want to add some pauses in between.
For Content like Text and Images to slide in and while i am scrolling. The Image Sequence should stop for that period of time while the Content Changes.
If every Content was displayed the Image Sequence should move on towards the next Frame where another Pause should happen so on and so forth.

See the Pen 2152a28cffe2c2c0cca8a3e47f7b21c6 by osublake (@osublake) on CodePen

Link to comment
Share on other sites

Hi Seb,


Sounds like you just need combine all that into a timeline, kind of like...


let tl = gsap.timeline({
  onUpdate: render,
  scrollTrigger: {
    scrub: 0.5

tl.to(airpods, {
  frame: 100,
  snap: "frame",
  ease: "none"

tl.to(".my-content", {
  x: -100

tl.to(airpods, {
  frame: frameCount - 1,
  snap: "frame",
  ease: "none"



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.