Jump to content
GreenSock

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

How to build this animation?

Recommended Posts

Hi guys, on this website https://alitwotimes.com/ im trying to create the sliding transition between 'work' and 'bio'

 

ive been attempting it with swup.js but havent had any luck, so i took a look through their code and noticed they're using GSAP. ive looked for any similar examples on youtube or in the plugins section but haven't found anything. could someone confirm for me this is do-able with GSAP, and also which plugins i should look at? any info would be great as im relatively a noob with anything like this.

 

thanks 😃

Link to comment
Share on other sites

Hey jackew and welcome to the GreenSock forums. Given that site uses GSAP for its animation I'd say it's quite doable with GSAP ;) 

 

With that being said there are multiple aspects to that transition:

  • A tool like Barba or Swup to transition between pages.
  • A clip-path animation to hide content inside of the container.
  • Translations on all the content in the viewport to animate it in as well.

Creating something like this requires building each piece and combining it all together. There's no one plugin that you can throw in there to do it all for you :) 

  • Thanks 1
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.
×