lister110 Posted November 29, 2021 Share Posted November 29, 2021 Hi everyone, can can someone please help. I'm playing around with a SVG mask (first try with CSS too, so please bear with me). I have taken an existing round mask/animation previously shown on codepen and have chosen to make it square. But at the moment the animation seems to animate top left, I'd like this to start from the centre. I have tried to playing around with the 'transformOrigin' but it doesn't seem to change, what am I doing wrong? thanks in advanced. See the Pen WNEqMZW by velvetsoup (@velvetsoup) on CodePen Link to comment Share on other sites More sharing options...
PointC Posted November 29, 2021 Share Posted November 29, 2021 Use scale instead of tweening the attributes. You'll also want to set the width and height of the rectangle to 100 because the viewBox is 100 x 100. See the Pen jOGOqxv by PointC (@PointC) on CodePen Happy tweening. 3 Link to comment Share on other sites More sharing options...
lister110 Posted November 29, 2021 Author Share Posted November 29, 2021 Thank you for a swift reply.. 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