While integrating counter up with my project I am getting this error on console

Uncaught TypeError: Cannot read property 'replace' of undefined
    at Waypoint.a [as callback] (jquery.counterup.min.js:9)
    at Waypoint.trigger (jquery.waypoints.min.js:59)
    at Group.flushTriggers (jquery.waypoints.min.js:531)
    at jquery.waypoints.min.js:438

Here is my html

<div class="value white">
	<p class="sbold addr-font-h1" ><span class="counter"> 1000 </span></p>
	<p>NEW Records</p>
</div>

here is jquery

<script type="text/javascript">
	$(document).ready(function() {
		$('.counter').counterUp();
	});
</script>

I ahve included script like below,

<!-- Counterup  -->
<script src="assets/vendor/counterup/jquery.waypoints.min.js"></script>
<script src="assets/vendor/counterup/jquery.counterup.min.js"></script>

Hi how can we stop its repeating once in counts and it again count the number and decrease the number every time

The problem exists on the mainpage, but the client needs it to be hidden from public view so I moved it here:
https://www.reseaualimentaire.com/open1

I tried to specify the type size but it's not changing it. And the counter is also weird. It used to count right up to the number in a few secs even if it was a huge number but now it takes forever, and won't count all the counters at the same time. (So it takes forever to do the first large number, while everything else stays "0".

It worked fine long after we updated wordpress to 4.8.1

Today all I did was switch the positions of the counters and it started fucking up. Even if I create a new one, on a separate page (so I know there are no weird classes settings etc. affecting it)

Hello.

I use this library in Mozilla version 19.

I need know to that browser this library works. Some document about this ?

thanks in advance

Hi,

I want to be able to have a percentage in the count like

25%

If I add percent now, I got NaN

I came across a problem with scrolling away from the counter whilst it was still in progress and then scrolling back again

If the original value is 100 and I scrolled away at 50, when I scrolled back it would count from 0 to 50 not 100

I fixed this by:
var $settings = settings;
var $originalText = $this.text(); // added this line

Changed:
var num = $this.text();
to
var num = $originalText;

Number 115 is displayed as 114 (delay: 10, time:1000).
Number 115 is displayed as 115 (delay: 10, time:1100).
Where is the problem?

24.0 works, 23 works and 25 works but 24 gets stuck at 23. Interestingly, the same issue can be replicated at 3, 6, 12, 24, 48 and 96...

I tried a few of the earlier posted solutions but still doesn't work.

Lets say I have a counting number. I scroll to it, it works great, then I do some more scrolling down the page, then I go up again back to it. I would like to see the count again from zero, is that possible?

When used the number "1,990", the script generates "1,989".
That's why on the list generation of incremental numbers to display, when it calls the operation to preserve as int if input was int, it uses "parseInt": (row 54 : var newNum = Math.round(num / divisions * i);)

(1990 / 100 * 100) = 1989.9999999999998
parseInt(1990 / 100 * 100) = 1989

the script should use instead Math.round
Math.round(1990 / 100 * 100) = 1990

Related:
https://stackoverflow.com/questions/49001063/how-to-make-counterup-jquery-plugin-run-only-once

Thanks

I want to animate number from specified number like start animating number from 100 to 500.

Do you have any plan to add support for a package manager such as bower.io ? http://bower.io/docs/creating-packages/

when i use 2.92 to countup,but always show 2.920 i want to only show 2.92

http reloading of waypoint.min.js gives error when served over https reloading

I get "invalid delete operand" sometimes.
i deleted this line from jquery.counterup.js to see if it solve issue.
delete $this.data('counterup-nums');

when i declare css property overflow-x:hidden , then counterup plugin stops working.
Any solution ??

FireFox 21 version - not working

Try 410, it will show 409

Regards,
WM

Trying start count from one not from zero.

Thank You for the Code. Its working on Local Host, But After Publish on Host, It not working. PLZ give Solution
Thank You!

When using the plug in, all other uses of the span tag break.
For example I had a bit of code that was simply...
<span class="author">Someones Name</span>

This then when the page renders just displays "NaN".

example input for reproducing this bug:
html number: 2014
delay: 10
time: 3000

this bug is caused by parsing numbers to int instead of rounding them.
just replace parseInt with Math.round.

What am i doing wrong?

There are two issues on my side:

<span class="counter">600</span>

I call jQuery 2.1.4, Waypoints 3.1.1 and Counterup 1.0 (in that order). Then I call this basic script:

$(document).ready(function() {
    $('.counter').counterUp(time:2000, delay:10);
});

As soon as the .counter element gets into viewport the script starts counting the numbers. Fine.
But when I scroll to the top of the page and scroll down again the counting starts over again (first issue). Annoying but not a problem.
The most weird thing is that the counting script is not getting to the number specified in HTML again. After page refresh it counts up to 600 as specified in HTML. Then I scroll up and down again, it starts to counf again. But it never gets up to 600. It stops at ~400. Doing the scrolling again it gets up to ~200.

Do you have any clue?

I have a use case where the end value is obtained programmatically. So this feature would be pretty slick.

If add counter on this 4,500,000 with comma then its working, but when i try 4.500.000 with comma in dutch currnecy formate then its giving NAN

Hello! Noticed strange thing!
delay:0 option blocks site event loop with 100 cpu

Hi i am wordpress developer and i am struggling to find that why it doesnt display 1974 in the theme..

Other every functionality runs fine and are correct i have done everything to the mark

if im using "jquery-3.3.1" library it will not work,
but if i am using "jquery.2.2.3" then it will work,
so give me the solution 'How can i use in jquery-3.3.1 ??'

waypoint script error "Cannot read property 'left' of undefined"

I am receiving this error when using jquery.counterup.js 1.0 and Waypoints - 3.1.1

Hi, thanks for the great plugin.
I want the counter to restart when I move up the page from bottom.
Right now, it works when I scroll down only.

Please let me know how can I add this: http://clients.hscdigital.com/safco_2/the-company/

Thank you

Hello,

For eg. i added 60,056 and when it count and finish it shows 60,055 and 107,235 shows 107,234

Counter-up not working with jquery 3.1.1 verson. please fix the problem.

Processing number: 1615 results in 1614 after countup.

Config is
$('#track-points:visible').counterUp({
delay: 10,
time: 1000
});

Quick fix is to ensure final number is in the array when it is declared. I.e:

        var num = $this.text();
        var nums = [num];

Alternatively, for loop should be adjusted to make sure the initial number is added.

Hi... thanx for your plugin!
there is a way to decelerate the numbers towards the end of the counter...

bye
francesco

Hi, is possible to have the counter in a loop, in time interval. an e.g:
when scroll target to numbers, counter starts, from "0" to " 13.423";
and then, in five seconds (an eg), the counter resumes the count, from 0 to 13.423 again.
its possible? like a 'loop' with interval.

2. i want to use 1.300.000, but returns "NAn" for me.
   how can i use this format of numbers??

Tks a lot!

I love this library.

Could we support exponential counting so the numbers look like they are accelerating faster as time goes by giving the user a perception of faster experience?

0, 1, 2, 4, 8, 16, 32... 1024

To do this we would have to replace parseInt(num / divisions * i) with a Math.Log function

so we can easily pass separate value from html.

example:
<span class="counter" data-delay="10" data-time="5000">52,147</span>

1981 resolves to 1980...

Hello Benjamin,
First I want to say great job.

Second, in my project, I was asked to introduce hours and time format
So I added a few lines to add your project support times.

Feel free to add to your project
And please DO NOT give me credit for this !!! Because the change is minor and insignificant .

Tnx Oren

(function( $ ){
"use strict";

$.fn.counterUp = function( options ) {

    // Defaults
    var settings = $.extend({
        'time': 400,
        'delay': 10
        }, options);

    return this.each(function(){

        // Store the object
        var $this = $(this);
        var $settings = settings;

        var counterUpper = function() {
            var divisions = $settings.time / $settings.delay;
            var num = $this.attr('data-value');
            var nums = [num];
            var isComma = /[0-9]+,[0-9]+/.test(num);
            num = num.replace(/,/g, '');
            var isInt = /^[0-9]+$/.test(num);
            var isFloat = /^[0-9]+\.[0-9]+$/.test(num);
            var isTime = /^[0-9]+\:[0-9]+\:[0-9]+$/.test(num);
            if (isTime) {
                num  = new Date('1970-01-01T' + num + 'Z').getTime() / 1000;  
            }

            var decimalPlaces = isFloat ? (num.split('.')[1] || []).length : 0;

            // Generate list of incremental numbers to display
            for (var i = divisions; i >= 1; i--) {

                // Preserve as int if input was int
                var newNum = parseInt(num / divisions * i);

                // Preserve float if input was float
                if (isFloat) {
                    newNum = parseFloat(num / divisions * i).toFixed(decimalPlaces);
                }

                // Preserve commas if input had commas
                if (isComma) {
                    while (/(\d+)(\d{3})/.test(newNum.toString())) {
                        newNum = newNum.toString().replace(/(\d+)(\d{3})/, '$1'+','+'$2');
                    }
                }

                // Preserve time if input was in time format 00:01:59
                if (isTime) {
                    newNum = (new Date(newNum * 1000)).toUTCString().match(/(\d\d:\d\d:\d\d)/)[0];
                }

                nums.unshift(newNum);
            }

            $this.data('counterup-nums', nums);
            $this.text('0');

            // Updates the number until we're done
            var f = function() {
                $this.text($this.data('counterup-nums').shift());
                if ($this.data('counterup-nums').length) {
                    setTimeout($this.data('counterup-func'), $settings.delay);
                } else {
                    delete $this.data('counterup-nums');
                    $this.data('counterup-nums', null);
                    $this.data('counterup-func', null);
                }
            };
            $this.data('counterup-func', f);

            // Start the count up
            setTimeout($this.data('counterup-func'), $settings.delay);
        };

        // Perform counts when the element gets into view
        $this.waypoint(counterUpper, { offset: '100%', triggerOnce: true });
    });

};

})( jQuery );

GPL is very very restrictive.

MIT or Apache is good.

I know you are owner and you can choose anything but you want to grow your user make under less restrictive. Pure suggestion :).

Also waypoint is now MIT here is : imakewebthings/waypoints@728ee37

-Yash

I have this jquery code for re-animating counts every 3 seconds :
$(document).ready(function(){
var countUpLoop = setInterval(countUpNumbers, 3000);
countUpNumbers();

  function countUpNumbers(){        
    $('h1.title').counterUp({
      delay: 100,
      time: 1000
    });
  };

});

HTML:
<h1 class="title" data-bind="title">300</h1>

*After few interations, the counterUp change the original value of 300 to 0.

Change to:
<h1 class="title" data-bind="title">0</h1>

I don't know why, please help to figure it out. Thank you.

Is it possible to add support for numbers with spaces as thousand separator? (e.g. 123 456)

Example:

jQuery('.counter').counterUp({
delay: 50,
time: 3000,
formatter: function (n) {
return n.replace(/,/g, '.');
}
});

Can you manage also the european number format (opposite to english) in terms of "." and "," inside numbers? i.e.:

• "." for > thousand
• "," for decimal < 1

Thanks in advance