Share Posted December 8, 2021 The function 'updateSize' makes a jump when display size height (h) = display size width (w). How can I rewrite the function 'updateSize' with Gsap to give a soft, linear scaling from desktop to mobile ? Can I use Gsap easing ? FUNCTION-UPDATE-SIZE.txt See the Pen MWEKEqo by steinarV (@steinarV) on CodePen Link to comment Share on other sites More sharing options...
Solution Solution Share Posted December 8, 2021 Just animate the values... gsap.to(svgbox, { scale: 1 }); gsap.to(wrapper, { marginTop: 0 }); gsap.to("html", { "--mySize": svgbox.offsetWidth * 0.1 + 'px'}) Although animating stuff during resize is probably not the best idea as there is going to be a lot of layout thrashing as the browser has to recalculate the position of everything. 1 Link to comment Share on other sites More sharing options...
Author Share Posted December 8, 2021 Okay, thank you . . . that was straightforward. 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