Show decimal value of counter

Question

How can I show the decimal value of only one counter only? Currently its rounding up the 4.7 to 5

$('.count').each(function() {
  $(this).prop('Counter', 0).animate({
    Counter: jQuery(this).text()
  }, {
    duration: 4000,
    easing: 'swing',
    step: function(now) {
      $(this).text(Math.ceil(now));
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="shiva"><span class="count">200</span></div>
<div id="shiva"><span class="count" id="reducedaily">4.7</span></div>

Try this: (4.7 % 1).toFixed(1). https://stackoverflow.com/questions/4512306/get-decimal-portion-of-a-number-with-javascript The question should be closed as duplicate though. — lainatnavi, Mar 05 '20 at 15:46
Does this answer your question? [Get decimal portion of a number with JavaScript](https://stackoverflow.com/questions/4512306/get-decimal-portion-of-a-number-with-javascript) — lainatnavi, Mar 05 '20 at 15:47

score 0 · Accepted Answer · edited Jun 20 '20 at 09:12

You can try using toFixed():

The toFixed() method formats a number using fixed-point notation.

jQuery('.count').each(function () {
  jQuery(this).prop('Counter',0).animate({
    Counter: jQuery(this).text()
  }, {
      duration: 4000,
      easing: 'swing',
      step: function (now) {
        if(this.id == 'reducedaily'){
          jQuery(this).text(now.toFixed(1));
        }
        else{
          jQuery(this).text(now.toFixed(0));
        }
      }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="shiva"><span class="count">200</span></div>
<div id="shiva2"><span class="count" id="reducedaily">4.7</span></div>

Please Note: The attribute id must be unique in a document.

Show decimal value of counter

1 Answers1