Hi All,
Is it possible to delay the jquery-plugin-circliful from starting the animation / loading until a div is in view, we load it at the bottom of the page on a scroller so the animation is missed by the time you get to it.
I would like it to load when the div .stats comes into view ?
Html:
<div class="stats">
<div id="myStat" class="inlined" data-dimension="250" data-text="57.4%" data-info="INCREASE IN WEEKLY REVENUE" data-width="10" data-fontsize="38" data-percent="57.4" data-fgcolor="#eee" data-bgcolor="transparent" data-fill="transparent"></div>
<div id="myStat2" class="inlined" data-dimension="250" data-text="68%" data-info="DECREASE IN CPA (MOM)" data-width="10" data-fontsize="38" data-percent="68" data-fgcolor="#eee" data-bgcolor="transparent" data-fill="transparent"></div>
<div id="myStat3" class="inlined" data-dimension="250" data-text="551%" data-info="INCREASE IN ROI (MOM)" data-width="10" data-fontsize="38" data-percent="551" data-fgcolor="#eee" data-bgcolor="transparent" data-fill="transparent"></div>
</div>
Jquery:
<script>
$( document ).ready(function() {
$('#myStat').circliful();
$('#myStat2').circliful();
$('#myStat3').circliful();
});
</script>
Any pointers would be great