Circular Countdown Clock Plugin For jQuery - CircularCountDownJs

Just another circular countdown timer jQuery plugin which creates an animated countdown clock to present the remaining time and executes a callback function when the countdown is end. No CSS, SVG or Canvas required.

How to use it:

1. Download and put the minified version of the jQuery CircularCountDownJs plugin after jQuery library.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="circular-countdown.js"></script>

2. Create an empty container for the countdown clock.

<div class="timer"></div>

3. Call the function and specify the target time from which you want to countdown.

$('.timer').circularCountDown({
  duration: {
  hours: 0,
  minutes: 0,
  seconds: 10
  },
});

4. Fire a function when the countdown is complete.

$('.timer').circularCountDown({
  duration: {
  hours: 0,
  minutes: 0,
  seconds: 10
  },
  end: function(){
    // do something
  }
});

5. More configuration options and callback functions.

$('.timer').circularCountDown({
  size: 60,
  borderSize: 10,
  colorCircle: 'gray',
  background: 'white',
  fontFamily: 'sans-serif',
  fontColor: '#333333',
  fontSize: 16,
  delayToFadeIn: 0,
  delayToFadeOut: 0,
  reverseLoading: false,
  reverseRotation: false,
  duration: {
      hours: 0,
      minutes: 0,
      seconds: 10
  },
  beforeStart: function(){},
  end: function(){}
});

---

This awesome jQuery plugin is developed by sygmaa. For more Advanced Usages, please check the demo page or visit the official website.