Stats

Copy
<section class="py-10" id="count-stats">
  <div class="container">
    <div class="row justify-content-center text-center">
      <div class="col-md-3">
        <h1 class="text-gradient text-info" id="state1" countTo="300"></h1>
        <h5 class="mt-3">Projects</h5>
        <p>Of “high-performing” level are led by a certified project manager</p>
      </div>
      <div class="col-md-3">
        <h1 class="text-gradient text-info" id="state2" countTo="70"></h1>
        <h5 class="mt-3">Hours</h5>
        <p>That meets quality standards required by our users</p>
      </div>
      <div class="col-md-3">
        <h1 class="text-gradient text-info" id="state3" countTo="30"></h1>
        <h5 class="mt-3">Support</h5>
        <p>Actively engage team members that finishes on time</p>
      </div>
    </div>
  </div>
</section>


<!-- Mandatory scripts -->
<script src="../../assets/js/plugins/countup.min.js"></script>
<script src="../../assets/js/soft-design-system-pro.js?v=1.0.0" type="text/javascript"></script>
<script type="text/javascript">
  if (document.getElementById("state1")) {
    const countUp = new CountUp("state1", document.getElementById("state1").getAttribute("countTo"));
    if (!countUp.error) {
      countUp.start();
    } else {
      console.error(countUp.error);
    }
  }
  if (document.getElementById("state2")) {
    const countUp1 = new CountUp("state2", document.getElementById("state2").getAttribute("countTo"));
    if (!countUp1.error) {
      countUp1.start();
    } else {
      console.error(countUp1.error);
    }
  }
  if (document.getElementById("state3")) {
    const countUp2 = new CountUp("state3", document.getElementById("state3").getAttribute("countTo"));
    if (!countUp2.error) {
      countUp2.start();
    } else {
      console.error(countUp2.error);
    };
  }
</script>

Stats 2

Screenshot
stats-2

Stats 3

Screenshot
stats-3