Jump to content
Search Community

MotionPath Drawing while scrollTrigger

earubae test
Moderator Tag

Go to solution Solved by GreenSock,

Recommended Posts

 

Hello @earubae - welcome to the GreenSock forums!

 

Something like that drawing path on that site you linked is most definitely possible with GSAP and its tools.

 

Your tools of choice should be scrubbing with ScrollTrigger and the DrawSVGPlugin (DrawSVG is a bonus plugin for all Club GreenSock members, but you can test it out for free on codepen and codesandbox or locally with the gsap-trial package).

 

See the Pen aYYOdN by GreenSock (@GreenSock) on CodePen

 

 

 

Here is a relatively simple demo to help you get started.

 

See the Pen rNOBLBV by GreenSock (@GreenSock) on CodePen

 

 

 

And here is one a bit more advanced by @Trapti where she recreated something very similar as seen on lemonade.com

 

See the Pen GRyBxeZ by tripti1410 (@tripti1410) on CodePen

 

 

 

I hope this will help. If you get stuck along the way and have questions specific to GSAP, let us know and we'll be happy to help. Happy Tweening!

 

  • Like 4
  • 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.
×
×
  • Create New...