Jump to content
GreenSock

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

Control canvas sprites with ScrollTrigger

Recommended Posts

Hi guys,

I've seen this beautiful site https://browserhistory.squarespace.com/ and I've tried to replicate animation for a test.

I started project with PIXI.js and the integration with GSAP sound good. But, how could be possible to manage the scroll and have effect in canvas?

Anyone have ideas? I've supposed ScrollTrigger could be the way for snap and repeat but I'm not sure about the right trigger to use 😅

 

Thanks to anyone

Link to post
Share on other sites

Hey lklio. ScrollTrigger is definitely the way to go for that sort of effect. I'd likely create it along the lines of this demo, found in the list of ScrollTrigger demos, but instead of animating the DOM elements you would animate you canvas elements instead.

Link to post
Share on other sites

Thanks @ZachSaucier, your demo is the answer of all questions!

Do you suggest to fix canvas with fixed position and control body scroll with ScrollTrigger? Or there is a better way?

 

Link to post
Share on other sites
3 minutes ago, lklio said:

Do you suggest to fix canvas with fixed position and control body scroll with ScrollTrigger? Or there is a better way?

That's a good setup :) 

  • Thanks 1
Link to post
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.

×