PixeledCode Posted March 17, 2021 Share Posted March 17, 2021 Hi, I have setup this basic progress bar that fills up depending on the maxlength attribute. Problem is that the progressbar animation is slow. I'm not sure what I am doing wrong. Any help is appreciated See the Pen KKNLdeB by PixeledCode (@PixeledCode) on CodePen Link to comment Share on other sites More sharing options...
Solution mvaneijgen Posted March 17, 2021 Solution Share Posted March 17, 2021 I think the problem is with creating a `.timeline()` you are better of just using `gsap.to()` without the time line, than it will just call it instantly instead of trying to add it to the timeline. `velocity` is as far as I know only something used in combination with Draggable and ScrollTrigger. Also I would not put on an `ease` to make it responde instantly See the Pen GRNajvx?editors=0010 by mvaneijgen (@mvaneijgen) on CodePen Just a semantic question: why are you not using the `<progress>` element , seems like a perfect fit https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress 4 Link to comment Share on other sites More sharing options...
akapowl Posted March 17, 2021 Share Posted March 17, 2021 Just as a sidenote to what @mvaneijgen said: 5 minutes ago, mvaneijgen said: Also I would not put on an `ease` to make it responde instantly GSAP has an ease of power1.out set to tweens by default. If you don't want it to have an ease you should set it to ease: "none". https://greensock.com/docs/v3/Eases 2 2 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