A real-time countdown timer for a web page. Will countdown to a target time, but only on days specified (eg: Mon-Fri).

daySensitiveCountdownTimer.js

if (document.getElementById('countdownTimer')) {
  pad = function(n, len) { // leading 0's
    var s = n.toString();
    return (new Array( (len - s.length + 1) ).join('0')) + s;
  };

  var timerRunning = setInterval(
    function countDown() {
      var now = new Date();
      if ( (now.getDay() >= 1) && (now.getDay() <= 5) ) { // Monday to Friday only
        var target = 15; // 15:00hrs is the cut-off point
        if (now.getHours() < target) { // don't do anything if we're past the cut-off point
          var hrs = (target - 1) - now.getHours();
          if (hrs < 0) hrs = 0;
          var mins = 59 - now.getMinutes();
          if (mins < 0) mins = 0;
          var secs = 59 - now.getSeconds();
          if (secs < 0) secs = 0;
          var str = pad(hrs, 2) + ':' + pad(mins, 2) + '.<small>' + pad(secs, 2) + '</small>';
          document.getElementById('countdownTimer').innerHTML = str;
        }
      }
    }, 1000
  );
}

Demo: http://darkblue.sdf.org/lab/day-sensitive-countdown-timer/timer.htm

Background: http://darkblue.sdf.org/weblog/post/day-sensitive-countdown-timer

Just wanted to say thankyou for the link. I've been searching for a way how to do the exact same thing for weeks!

Really appreciate the share

You're very welcome Daniel. I'm glad you found it useful.

Works great! Except the time shows 00:00.00 during the entirety of the target hour... Can this be modified so that the target time is say, 15:01?

Updated to work with CSP when script-src is set to "self" only.

Hi There,

Is this plugin still working as I have installed that script on my site and nothing is happening. Do you have to include any other dependancy to make it work?

ps. If I can get this working that would be amazing so thanks in advanced for the help.

Hope you can help.

Many Thanks, Luke

I am trying to use this also and it's not working. All I get is 00:00:00 for the countdown timer no matter what time of day it is.

Those having problems with the plugin not working resulting in '00:00:00'. I have found that when i place the code inside my header it doesn't seem to work. I have moved the piece of code to my footer just before the footer tag and its now working.

< script type="text/javascript" src="daySensitiveCountdownTimer.js"></script>
< footer>
content
< /footer>

Unfortunately it doesn't work for me. No matter where I place the code.

anyway of getting this to use server time? or a specific timezone actually... like EST