Red (random stuff)

Hi! Made this last year.

I’m a beginner. When I came up with it I thought this code was really something, but looking to it now… it looks like a mess :face_with_peeking_eye:

Check it out:

Code: GitHub - 9uifranco/red: Three.js animation with Gsap/ScrollTrigger :skull:


It is good.
It is also good that the red is just a red paint.

Can you make the transition smoother? Currently the scroll makes 3 small stops between the initial and the final scene. These stops happen both while scolling down and scrolling up. I thought they are made on purpose, but I was not able to understand what was so special with these three stops.

1 Like

I’m using the ScrollTrigger plugin from GSAP to make elements move/appear based on the user’s scrolling. With ScrollTrigger you define triggers that start animating an element when the page reaches a certain point and stop when it reaches another. The stops you said are probably gaps between these triggers, which means that after an animation finishes, the user has to scroll a bit further before the next one starts.

Thank you for commenting. Made me think through it. A smoother transition indeed would be better. When I get some time I’ll adjust the starting position of each trigger to immediately follow the ending position of the previous one to fix it.

1 Like