Kelimino Posted April 26, 2021 Share Posted April 26, 2021 Hello everyone, I made this simple section counter with scrolltrigger, i am almost there but i miss some points to make it work correctly. The count from "0 to 5" is not even. Is there a similar topic, answer to this ? Thanks Have a nice day See the Pen yLgwOwL by kelligart (@kelligart) on CodePen Link to comment Share on other sites More sharing options...
Solution Shaun Gorneau Posted April 26, 2021 Solution Share Posted April 26, 2021 Hi @Kelimino, A few things that stand out to me are You're recreating the timeline multiple times rather than adding tweens (or other timelines) to it While call() would work here on appending tweens/timelines, you are appending it to a single timeline each time that timeline is recreated Unrelated to the issue; if you define a from() tween, it will perform that tween from the defined property values to the element's current values, so you don't need to follow up with a to() tween ... unless your defined end target values that are not the values in place before the from() is called. I think an easier way to handle this would be with ScrollTrigger.create() and not make use of any timelines (along with not worrying about defining any toggleActions). I think it's easier to use the callbacks onEnter and onEnterBack to update the counter and perform a simple tween on it. Also, adding end points gives you better control over when to trigger onEnterBack for better usability. Without defining them here, onEnterBack into slide 1 would not be triggered because the scroll can't reach the trigger point. Have a look here, See the Pen KKaEgvZ?editors=0010 by sgorneau (@sgorneau) on CodePen Hope this helps! 4 Link to comment Share on other sites More sharing options...
Kelimino Posted April 26, 2021 Author Share Posted April 26, 2021 Hi Shaun, A big thanks for your answer and explanation. Several things that i didnt catch: scrollTrigger.create, onEnter/Back, and a gsap function. I need to look further at it and not only the basics of gsap. Many thanks again. Have a nice Day 1 Link to comment Share on other sites More sharing options...
Shaun Gorneau Posted April 26, 2021 Share Posted April 26, 2021 You're welcome! Happy to help. 1 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