stijns96

Thank you so much! I played a little with the given code and came out with this: // Init Controller var controller = new ScrollMagic.Controller(); $('.skillbar-container').each(function () { var skillbar = $(this).find('.skillbar-inner'),count = $(this).find('.count'), animateSkill = new TimelineMax(), level = { value: 0, endValue: count[0].innerText }, animateSkill = new TimelineMax(); animateSkill .to(skillbar, 1, {width: skillbar.data("width") + '%'}) .from(count, 1, {autoAlpha: 0}, 0) .to(level, 1, {value: level.endValue, onUpdate: function () { count[0].innerText = Math.round(level.value) + '%'; }}, 0); var scene = new ScrollMagic.Scene({ triggerElement: skillbar, triggerHook: 0.5, reverse: false }) .addIndicators({ name: 'animate skillbar' }) .setTween(animateSkill).addTo(controller); }); Now it's working perfectly!

Hi there, I have some skill bars on my website that I animate with TweenMax. Also I have added percentage counters by the skill bars with jQuery. But the problem that I have is that the skill bars animate when they reach a certain point and the counters not. Does anybody know how I can animate the counters at the same time as the skill bars? Preferably with TweenMax (In my opinion the most efficient way). Thanks in advance!