A jQuery countdown plugin.

• Documentation

Include files:

<script src="/path/to/jquery.js"></script><!-- jQuery is required -->
<script src="/path/to/countdown.js"></script>

<span countdown>Feb 02 2020 20:20:22</span>

<span countdown data-date="Feb 02 2020 20:20:22"></span>

<span class="countdown">Feb 02 2020 20:20:22</span>

$(".countdown").countdown();

<span class="countdown"></span>

$(".countdown").countdown({
    date: new Date(2020, 1, 2, 20, 20, 22)
});

Setup with $("#target").countdown(options), or global setup with $.fn.countdown.setDefaults(options).

• type: boolean
• default: true

Auto start the countdown when initialized.

• type: object / number / string
• default: null

The target date, allow date object, time number (milliseconds) and valid date string.

• type: boolean
• default: false

Set it true to update the date number per one tenth second.

• type: function
• default: function() {}

The function will be run when the countdown end.

• type: string
• default: "%s days, %s hours, %s minutes, %s seconds"

Just a text template, you can customize it, e.g., "%s D / %s H / %s M / %s S".

• Start the countdown.
• Usage: $().countdown("start").

• Stop the countdown
• Usage: $().countdown("stop").

• End the countdown
• Usage: $().countdown("end").

-Destroy the countdown

• Usage: $().countdown("destroy").

Add data-* attribute to time number wrapper in the target container, then the time numbers will be updated when time change.

For example:

<div countdown data-date="Feb 02 2020 20:20:22">
    <span data-days>0</span> days
    <span data-hours>0</span> hours
    <span data-minutes>0</span> minutes
    <span data-seconds>0</span> seconds
</div>

• IE 6+
• Chrome 33+
• Firefox 27+
• Safari 5.1+
• Opera 19+

As a jQuery plugin, you can reference to the jQuery Browser Support.

Released under the MIT license.