jQuery Relative Time Countdown Plugin - text-countdown.js

text-countdown.js is a simple lightweight jQuery countdown plugin that outputs the remaining time in a human readable format such as 'The sale starts in about 7 days and 12 hours.'.

How to use it:

1. Load jQuery library and the text-countdown.js script in the document.

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="js/text-countdown-1.0.1-en-us.js"></script>

2. Specify the target time in UTC you wish to countdown from. All the plugin parameters can be passed in via data-OPTION attributes as displayed below.

<div class="countdown-timer"
  data-month="11"
  data-day="27"
  data-year="2015"
  data-hour="00"
  data-prefix="The Black Friday Sale starts in "
  data-suffix=". Hooray!"
  data-delimiter=" and"
>Custom message</div>

3. Call the plugin to active the countdown timer.

$('.countdown-timer').textCountdown();

4. This will output the markup structure as follow.

<div class="text-countdown-container">
  <span class="text-countdown-prefix">The Black Friday Sale starts in </span>
  <span class="text-countdown-about">about</span>
  <span class="text-countdown-days">
    <span class="text-countdown-num">xxx</span>
    <span class="text-countdown-label">days</span>
  </span>
  <span class="text-countdown-delimiter">and</span>
  <span class="text-countdown-remainder">
    <span class="text-countdown-num">xx</span>
    <span class="text-countdown-label">hours</span>
  </span>
  <span class="text-countdown-suffix">. Hooray!</span>
</div>

5. All the default plugin parameters.

classPrefix: '',
prefix: '',
suffix: '',
delimiter: '',
hour: 0,
minute: 0,
second: 0

---

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