title: Animate numbers using pure CSS during loading
body: <p>I manage to get this going with jQuery from many of the examples available online. However, I'm wondering if it's possible to do this using pure CSS without any javascript.</p>
  
  <p><a href="https://jsfiddle.net/9q4khw0q/" rel="nofollow noreferrer"><strong>JSFiddle DEMO</strong></a></p>
  
  <p>HTML</p>
  
  <pre><code>&lt;span class="count"&gt;9999&lt;/span&gt;
  </code></pre>
  
  <p>jQuery</p>
  
  <pre><code>$('.count').each(function () {
      $(this).prop('Counter',0).animate({
          Counter: $(this).text()
      }, {
          duration: 4000,
          easing: 'swing',
          step: function (now) {
              $(this).text(Math.ceil(now));
          }
      });
  });
  </code></pre>
  
  <p>I don't mind if 9999 just rotates on page load without starting from 0. I just want to show the animation effect during the page load.</p>