Hi markallenrupert,

Sure, I will tell you how exactly you can achieve this, firstly you need to add this function to your JS file:

function countableElement( el ) {
    var $this = $(el),
        $num = $this.find('.num'),
    
        start = attrDefault($num, 'start', 0),
        end = attrDefault($num, 'end', 0),
        prefix = attrDefault($num, 'prefix', ''),
        postfix = attrDefault($num, 'postfix', ''),
        duration = attrDefault($num, 'duration', 1000),
        delay = attrDefault($num, 'delay', 1000),
        format = attrDefault($num, 'format', false);
    
    if(start < end)
    {
        if(typeof scrollMonitor == 'undefined')
        {
            $num.html(prefix + end + postfix);
        }
        else
        {
            var tile_stats = scrollMonitor.create( el );
    
            tile_stats.fullyEnterViewport(function(){
    
                var o = {curr: start};
    
                TweenLite.to(o, duration/1000, {curr: end, ease: Power1.easeInOut, delay: delay/1000, onUpdate: function()
                    {
                        $num.html(prefix + (format ? numberWithCommas( Math.round(o.curr) ) : Math.round(o.curr)) + postfix);
                    }
                });
    
                tile_stats.destroy()
            });
        }
    }
}

On HTML you should add the counter container markup:

<div id="the_counter">
    <div class="num" data-start="0" data-end="100" data-postfix="" data-duration="100" data-delay="0">0</div>
</div>

Then you can execute the animation after you get the data:

var $counter = $('#the_counter'),
    $counterNum = $counter.find('.num');
        
// Configure counter data, default data on HTML data-{name} attribute will be used
// To overwrite animation values enter the data in object
$counterNum.data({
    start: 0,
    end: 500,
    duration: 1000
});
// Execute animation
countableElement($counter);

This is basically the implementation. I hope it helps you.