I would like to use GSAP to animate borders on scroll trigger

[crmichael]

I want to replicate this border animation here - https://dft.websitestaging.live/get-started/ using GSAP with scroll triggered, so the borders animate when scrolled into viewport. I have both horizontal and vertical borders to animate.

[GreenSock]

That's pretty easy with ScrollTrigger. I'd recommend animating the scaleX of a regular 1px tall element rather than the border because it's cheaper for the browser to render (better performance): 

See the Pen bGjqXLK?editors=1010 by GreenSock (@GreenSock) on CodePen

 

I'd recommend reading up on ScrollTrigger: https://greensock.com/docs/v3/Plugins/ScrollTrigger

 

There are lots of demos here: https://greensock.com/st-demos

 

Have fun!