JSFiddle - React, Tailwind, and code Playground

by Mukesh Singh Negi

HTML

<script src="https://aishek.github.io/jquery-animateNumber/javascripts/jquery.animateNumber.js"></script>
<div>Scroll Down</div>
<h1 id="scroll-to"><p id="decimals">From $0,00 to $5000,00</p></h1>

CSS

div {
    height:800px;
    background:red;
}
h1 {
  display:none;
}

JavaScript

$(window).scroll(function() {
   var hT = $('#scroll-to').offset().top,
       hH = $('#scroll-to').outerHeight(),
       wH = $(window).height(),
       wS = $(this).scrollTop();
    console.log((hT-wH) , wS);
   if (wS > (hT+hH-wH)){
       $('#decimals')
  .animateNumber(
    {
      number: 2500,
      numberStep: function(now, tween) {
        var formatted = now.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
        $(tween.elem).text('$' + formatted);
      }
    },
    20000
  );
       $('#scroll-to').fadeIn(3500);
   }
});