Countdown Clock With Specific Timezone - countdown.jquery.js

A lightweight, Bootstrap-compatible jQuery countdown plugin that counts the days/hours/minutes/seconds to a specific DateTime in any time zone.

How to use it:

1. Download and insert the JavaScript file countdown.jquery.js after loading jQuery JavaScript library.

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
        crossorigin="anonymous"></script>
<script src="js/countdown.jquery.js" defer></script>

2. Attach the plugin to the container element in which you want to place the countdown clock and override the default DateTime the clock will count down towards to.

<div id="countdown"></div>

<div id="countdown"></div>

3. Attach the plugin to the container element in which you want to place the countdown clock and override the default DateTime the clock will count down towards to.

$(function(){
  $('#countdown').countdown({
    year: 2016, // YYYY Format
    month: 1, // 1-12
    day: 1, // 1-31
    hour: 0, // 24 hour format 0-23
    minute: 0, // 0-59
    second: 0, // 0-59
  });
});

4. Customize the time zone you want to use. Default: -6. Check out the list of all time zones.

$(function(){
  $('#countdown').countdown({
    timezone: -6
  });
});

5. Determine whether or not to show the days/hours/minutes/hours labels. Default: true.

$(function(){
  $('#countdown').countdown({
    labels: true
  });
});

6. Execute a callback function when the countdown is completely finished.

$(function(){
  $('#countdown').countdown({
    onFinish: function () { 
      // Do something
    } 
  });
});

Changelog:

2019-04-21

• Fixed comments in the JS

---

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