I have following countdown code.
$(function () {
var austDay = new Date(2016 , 0, 12, 12);
$('#defaultCountdown').countdown({until: austDay, layout: '{dn} {dl}, {hn} {hl}, {mn} {ml}, and {sn} {sl}'});
$('#year').text(austDay.getFullYear());
});
I just want to change the counter to extend one year, i changed the year from 2015 to 2016 but it is not working My landing page is hosted Here. Appreciate any help
Hi i am not familiar with countdown.js but here is an pure javascript solution.
var myVar = setInterval(function() {
myTimer()
}, 1000);
function myTimer() {
var dateThen = new Date(2016 , 11, 0, 12);
var dateNow = new Date();
var diff = dateThen - dateNow;
var days = Math.floor(diff / (1000 * 60 * 60 * 24));
var hours = Math.floor((diff - (days * 1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((diff - (hours * 1000 * 60 * 60) - (days * 1000 * 60 * 60 * 24)) / (1000 * 60));
var seconds = Math.floor((diff - (minutes * 1000 * 60) - (hours * 1000 * 60 * 60) - (days * 1000 * 60 * 60 * 24)) / 1000);
document.querySelector('[data-days]').innerHTML = days;
document.querySelector('[data-hours]').innerHTML = hours;
document.querySelector('[data-minutes]').innerHTML = minutes;
document.querySelector('[data-seconds]').innerHTML = seconds;
}#defaultCountdown {
background-color: #232323;
width: 757px;
height: 60px;
line-height: 60px;
border-radius: 5px;
}
.hasCountdown {
text-align: center;
margin-left: 20px;
margin-right: 20px;
color: #E5E5E5;
margin-top: 45px;
font-size: 26px;
font-weight: normal;
font-family: Georgia, "Times New Roman", Times, serif;
}<div id="defaultCountdown" class="hasCountdown">
<span data-days></span>,
<span data-hours></span>,
<span data-minutes></span>,
<span data-seconds></span>
</div>The problem is that the date you are setting is already passed.
new Date(2016 , 0, 12, 12)
means 12th of January.
Perhaps you want new Date(2016 , 11, 0, 12)
The date you have inserted
new Date(2016 , 0, 12, 12);
is already passed
Date {Tue Jan 12 2016 12:00:00}
