Changing the format of jQuery Countdown?

Question

I'm trying to get my countdown timer to say 0 Yrs, 0 Months, 7 days 0 Mins etc, but whatever number I try to enter and as much as I try to work it out, I get answers like 7,349 days etc. Here is the code:

// jQuery Countdown styles 1.6.1. - plugin by Keith Wood
function counter_start() {
    var austDay = new Date();
    austDay = new Date(austDay.getFullYear() - 2016, 0 - 7, 0); // Examples: (austDay.getFullYear() + 1, 3 - 1, 6) or (2013, 3 - 1, 6)
    $("#defaultCountdown").countdown({
        until: austDay, 
        format: 'DHMS'
    });
}

I've looked and read up and asked other people but it's not my area, and I just don't understand it. Anyone give me a heads up? Many thanks for reading. Jamie.

Answer 1

Your format is not exact. Please try:

$('#defaultCountdown').countdown({
    until: austDay, 
    format: 'YODM'
});

Y = Years

O = Months

D = Days

M = minutes

Answer 2

Try this for your countdown timer plugin Jquery.countdown

Try this by customizing your custom.js

 $('#clock').countdown('2016/10/31').on('update.countdown',   
     function(event) {
   var $this = $(this).html(event.strftime(''

     + '<div><span>%-d</span>day%!d</div>'
     + '<div><span>%H</span>hr</div>'
     + '<div><span>%M</span>min</div>'
     + '<div><span>%S</span>sec</div>'));
 });

Answer 3

I like this approach from the official documentation at http://keith-wood.name/countdownRef.html to apply any format that you want, customized by yourself:

$(selector).countdown({ 
    until: liftoffTime, onTick: watchCountdown}); 

function watchCountdown(periods) { 
    $('#monitor').text('Just ' + periods[5] + 
        ' minutes and ' + periods[6] + ' seconds to go'); 
}

In that official documentation, they explain exactly what onTick does and how you can use it:

A callback function that is invoked each time the countdown updates itself. Within the function this refers to the division that holds the widget. The array of current countdown periods (int[7] - based on the format setting) is passed as a parameter: [0] is years, 1 is months, [2] is weeks, [3] is days, [4] is hours, [5] is minutes, and [6] is seconds.

Answer 4

This on is easy to use in your case. Specify in var target_date the date you want to countdown to. You can change the output format in the end of the script at countdown.innerhtml.(already Y:M:D:S format)

ar target_date = new Date("Aug 15, 2018").getTime();
var days, hours, minutes, seconds;

setInterval(function () {
var countdown = document.getElementById("countdown");
var current_date = new Date().getTime();
var seconds_left = (target_date - current_date) / 1000;


days = parseInt(seconds_left / 86400);
seconds_left = seconds_left % 86400;

hours = parseInt(seconds_left / 3600);
seconds_left = seconds_left % 3600;

minutes = parseInt(seconds_left / 60);
seconds = parseInt(seconds_left % 60);

countdown.innerHTML = days + "d, " + hours + "h, "+ minutes + "m, " + seconds + "s";  }, 1000);

and put the html in the body:

<span id="countdown"></span>