Share Posted May 1 Hello, I'm wanting to recreate this border animation where it draws in a thicker border to the lighter border on the footer of this site: https://ventriloc.ca/fr/ Would anyone be able to point me in the right direction in how I can achieve this affect or a similar affect? An idea I had was instead of keeping the thicker orange border small as you scroll down the page but having it expand to it's full parent container border instead of just going around. Any help/insight would be greatly appreciated. Thanks! Link to comment Share on other sites More sharing options...
Share Posted May 1 Are you talking about the border animation where a small chunk of the line/border animates around the edges (on top of the thinner line)? That'd be perfect for DrawSVG (Club GreenSock membership benefit). 1 Link to comment Share on other sites More sharing options...
Share Posted May 1 Jack beat me to it, but yep - DrawSVG makes that super easy. See the Pen BaKGyaa by PointC (@PointC) on CodePen Happy tweening. 1 Link to comment Share on other sites More sharing options...
Author Share Posted May 1 Perfect. Would I use ScrollTrigger to tie the animation to scroll them I'm guessing? Link to comment Share on other sites More sharing options...
Share Posted May 1 4 minutes ago, caleb_case said: Perfect. Would I use ScrollTrigger to tie the animation to scroll them I'm guessing? Exactamundo. ✅ Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now