I have wordpress website and I put in countdown script and working and I want to customize this script and wondering about many points:
1-is possible to make the countdown for every 8 hours? For example, when the countdown reached zero (00-00-00), it will refresh page and automatically start over again 08-00-00 .
2-how can I do to keep the countdown constant? I mean, everytime I load the page is still in the start time, There isn't a way to keep the countdown even when you close the tab?
here is my js code
jQuery(document).ready(function($) {
$('.countdown').final_countdown({
start: '1362139200',
end: '1388461320',
now: '1387461319',
selectors: {
value_seconds: '.clock-seconds .val',
canvas_seconds: 'canvas-seconds',
value_minutes: '.clock-minutes .val',
canvas_minutes: 'canvas-minutes',
value_hours: '.clock-hours .val',
canvas_hours: 'canvas-hours',
value_days: '.clock-days .val',
canvas_days: 'canvas-days'
},
seconds: {
borderColor: '#7995D5',
borderWidth: '6'
},
minutes: {
borderColor: '#ACC742',
borderWidth: '6'
},
hours: {
borderColor: '#ECEFCB',
borderWidth: '6'
},
days: {
borderColor: '#FF9900',
borderWidth: '6'
}}, function() {
// Finish callback
});
});
I am waiting for your help answers. When you answer my question please copy my code and edit your answer there.
If you want the same countdown for all the users, you need to use an external source, like a file or a database to denote the starting time (unless you want to "anchor" or hard-code the starting time to a specific global moment in time, like I did in the example below). If you want individual countdowns for all users, you can use browser storage engines like local storage (local storage is probably the easiest/quickest way, but you can use cookies, websql, etc...).
And to achieve repetition after each 8 hours, a simple math modulus operator would do - you just denote the starting time and from there you show the modulus (remainder of total time divided by 8 hours).
An example:
var t = document.getElementById('t');
setInterval(function(){
t.textContent = (new Date().getTime() / 1000 | 0) % 15;
}, 1000);
Repeating every 15 seconds (you need 8 hours instead)
<p id="t"></p>