0

I would like to add this animation (http://aishek.github.io/jquery-animateNumber/ EXAMPLE 3) to my code but seems like it doesn't work.

JSFiddle with code animation: https://jsfiddle.net/252jxsjq/6/ JSFiddle without code animation: https://jsfiddle.net/252jxsjq/5/

Code without animation:

var counter = localStorage.getItem('rans') || 0;
var counter = Number(localStorage.getItem('rans')) || 0;
var counter1 = Number(localStorage.getItem('bans')) || 0;

$('.redanswer').click(function(){
     localStorage.setItem('rans', ++counter);
     $( '.bpercent' ).html( counter1 * 100 / (counter1+counter) + "%" );
     $( '.rpercent' ).html( counter * 100 / (counter1+counter) + "%" );

});

var counter1 = localStorage.getItem('bans') || 0;
var counter = Number(localStorage.getItem('rans')) || 0;
var counter1 = Number(localStorage.getItem('bans')) || 0;

$('.blueanswer').click(function(){
     localStorage.setItem('bans', ++counter1);
     $( '.rpercent' ).text( counter * 100 / (counter1+counter) + "%" );
     $( '.bpercent' ).text( counter1 * 100 / (counter1+counter) + "%" );
});

Example of the Animation to add:

<p>Fun level <span id="fun-level" style="color: red;">0 %</span>.</p>

var percent_number_step = $.animateNumber.numberStepFactories.append(' %')
$('#fun-level').animateNumber(
  {
    number: 100,
    color: 'green',
    'font-size': '30px',

    easing: 'easeInQuad',

    numberStep: percent_number_step
  },
  15000
);
Niccolò Guidi
  • 195
  • 2
  • 14

0 Answers0