Cacher is the code snippet organizer for pro developers

<script type="text/javascript" src="/SiteFiles/2514/js/countUp.min.js"></script>
<script type="text/javascript" src="/SiteFiles/2514/js/jquery.inview.js"></script>
 <script type="text/javascript">
    $(document).ready(function() {
      // COUNT UP SCRIPT
      var options = {
        useEasing : true,
        useGrouping : true,
        separator : ','
      }

          {% for Item in List.Items -%}

      var {{ Item.FieldValues.Id }} = new countUp("{{ Item.FieldValues.Id }}",0, {{ Item.FieldValues.StatisticNumber }}, 0, 2.5, options);
      {% endfor -%}


{% for Item in List.Items -%}
      $('.Stat{{ Item.FieldValues.Id }}').bind('inview', function(event, visible) {
        if(visible == true) {
          // element is now visible in the viewport
          
              {{ Item.FieldValues.Id }}.start();
           		console.log('stat is in view');
           		
       } else {
          // element has gone out of viewport
              {{ Item.FieldValues.Id }}.reset();
              console.log('stat is not in view');
              
      
        }
      });
      {% endfor -%}
    });
 </script>

 <div class="pill-divider tc absolute w-100  left-0"><span class="dib pa2 tc br-pill bg-gray"><img alt="pill image" src="/SiteFiles/2514/css/images/pill.svg" /></span></div>

{% if Module.FieldValues.TitleText -%}
<h2 class="tc hidden-element delay-1">{{ Module.FieldValues.TitleText }}</h2>
<h5 class="tc hidden-element delay-1">{{ Module.FieldValues.TitleSubText }}</h5>
{% endif -%}

{% assign sorted = List.Items | OrderBy:'FieldValues.DisplayOrder','asc' %} 

<div class="statistics flex flex-row justify-center w-100 mw9 center mb4">
{% for Item in sorted -%}
    <div class="item pa4 ph5-ns tc percentage bg-light-beige Stat{{ Item.FieldValues.Id }}">
        <h6 class="mb3">{{ Item.FieldValues.Name }}</h6>
        <h5 class="no-border ma0 burgundy">DOWN<span class="icon icon-arrow-down"></span></h5>
        <h1 class="no-border ma0 burgundy" id="{{ Item.FieldValues.Id }}">{{ Item.FieldValues.StatisticNumber }}</h1>
    </div>
{% endfor -%}
</div>
{% if Module.FieldValues.FooterText -%}
<p class="tc"><em>{{ Module.FieldValues.FooterText }}</em></p>
{% endif -%}