Skip to content
Browse files

Clean up setting of options, and provide example of counting infinitely

  • Loading branch information...
1 parent b1925c3 commit aa6ed805395b8c66ed1ffd12c738faab2672b5bb @mhuggins committed Feb 9, 2013
Showing with 32 additions and 14 deletions.
  1. +24 −5 example.html
  2. +8 −9 jquery.countTo.js
View
29 example.html
@@ -71,15 +71,22 @@
Earth's Gravity
<button class="restart" data-target="#gravity">Restart</button>
</h2>
- <p><b class="timer" id="gravity" data-from="0.0" data-to="9.8" data-speed="3000" data-decimals="2"></b> m/s<sup>2</sup></p>
+ <p><b class="timer" id="gravity" data-from="0" data-to="9.8" data-speed="3000" data-decimals="2"></b> m/s<sup>2</sup></p>
+ </div>
+
+ <div class="example">
+ <h2>
+ To infinity...and beyond!
+ <button class="restart" data-target="#infinity">Restart</button>
+ </h2>
+ <p><b class="timer" id="infinity" data-from="0" data-to="1" data-speed="1000"></b></p>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.countTo.js"></script>
<script type="text/javascript">
jQuery(function ($) {
- // simple examples
// custom formatting example
$('#earth').data('countToOptions', {
formatter: function (value, options) {
@@ -94,17 +101,29 @@
}
});
+ // another custom callback for counting to infinity
+ $('#infinity').data('countToOptions', {
+ onComplete: function (value) {
+ count.call(this, {
+ from: value,
+ to: value + 1
+ });
+ }
+ });
+
+ // start all the timers
$('.timer').each(count);
+ // restart a timer when a button is clicked
$('.restart').click(function (event) {
event.preventDefault();
var target = $(this).data('target');
count.call($(target));
});
- function count() {
- var $this = $(this),
- options = $this.data('countToOptions') || {};
+ function count(options) {
+ var $this = $(this);
+ options = $.extend({}, options || {}, $this.data('countToOptions') || {});
$this.countTo(options);
}
});
View
17 jquery.countTo.js
@@ -1,17 +1,16 @@
(function ($) {
$.fn.countTo = function (options) {
- // merge the default plugin settings with the custom options
- options = $.extend({}, $.fn.countTo.defaults, options || {});
+ options = options || {};
return $(this).each(function () {
// set options for current element
- var settings = $.extend({}, options, {
- from: parseFloat($(this).attr('data-from') || options.from),
- to: parseFloat($(this).attr('data-to') || options.to),
- speed: parseInt($(this).attr('data-speed') || options.speed, 10),
- refreshInterval: parseInt($(this).attr('data-refresh-interval') || options.refreshInterval, 10),
- decimals: parseInt($(this).attr('data-decimals') || options.decimals, 10)
- });
+ var settings = $.extend({}, $.fn.countTo.defaults, {
+ from: $(this).data('from'),
+ to: $(this).data('to'),
+ speed: $(this).data('speed'),
+ refreshInterval: $(this).data('refresh-interval'),
+ decimals: $(this).data('decimals')
+ }, options);
// how many times to update the value, and how much to increment the value on each update
var loops = Math.ceil(settings.speed / settings.refreshInterval),

0 comments on commit aa6ed80

Please sign in to comment.
Something went wrong with that request. Please try again.