Skip to content

Instantly share code, notes, and snippets.

@will83
Last active August 29, 2015 13:56
Show Gist options
  • Save will83/8790105 to your computer and use it in GitHub Desktop.
Save will83/8790105 to your computer and use it in GitHub Desktop.
Increment multiple counters each second with jquery (with decimals)
<!-- Don't forget to include jquery -->
<!-- the markup -->
<span class="counter" data-increment-value="0.07" data-increment-time="1000">1000.45</span>
<span class="counter" data-increment-value="0.03" data-increment-time="100">814.73</span>
<!-- the script -->
<script>
$( ".counter" ).each(function() {
// Get initial value (span value) as a number
var initial_value = +($(this).text());
// Get increment value inside the data-increment-value HTML5 tag
var increment_value = $(this).data("increment-value");
// Get increment time inside the data-increment-time HTML5 tag
var increment_time = $(this).data("increment-time");
// Define a variable for $(this)
var that = this;
setInterval(function(){
// increment the value
initial_value += increment_value;
// define the value as text of the span (this) // each millisecond
$(that).text(initial_value.toFixed(2));
}, increment_time);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment