adamo Posted October 18, 2023 Share Posted October 18, 2023 Hi. Im using a loop to set variables for a speedometer animation. In the codepen the're three instances of an svg - the idea is to get animation properties from data-attributes. The arrow is animating properly but the percentage amount stays the same for all instances. As a side note how to make the mask 0% at the start? So the green fill wont be visible when starting the animation. See the Pen QWzedKa by depcore (@depcore) on CodePen Link to comment Share on other sites More sharing options...
Solution GreenSock Posted October 18, 2023 Solution Share Posted October 18, 2023 That's because you had faulty markup where all the masks were using the same ID. In any HTML document, there should never be two elements that share the same ID. Is this what you were looking for?: See the Pen rNoXGrd?editors=1010 by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
adamo Posted October 18, 2023 Author Share Posted October 18, 2023 Yes exactly. Stupid mistake on my part Thank you. 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