how to create a javascript countdown which on refreshing continues counting

I try it with javascript and jquery but no idea how to do that. i wont to let the timer not begins on refreshing counting again. It´s same as an auction when he counting down 3,2 and on refreshing he don´t begins again it should continue count down where it last ended. And on other products it must count from 3 again. Have anyboy an idea?

Edit: because some users missunderstood what i am searching for.

my issue is that i don´t know how to save the time when someone refresh the page to continue to count it down. if someone refresh the site at 21sec and he or she have 30 secs to make there choice. and after refreshing the site, the counter will count at 21sec down and not started again by 30sec again. no ajax.

When possible hardcoded. And if not possible then the cookie variant.

You can set a name to your window on load of the page. Before setting the name check whether this window already has a name.

if it doesn't have a name, set a name to the window and start counting at 0 and save the count value in a cookie each time it increment.

if it does have a name(that means page is reloaded), read the count value from the cookie and do the increment and save to cookie.

EDIT: Example, Call initCount() function on body load. Use decrementAndSave function to decrement the value of the count and save it to cookie.

var count = 3;// 3 -> 2 -> 1

function getCookie(c_name) {
    var i, x, y, ARRcookies = document.cookie.split(";");
    for (i = 0; i < ARRcookies.length; i++) {
        x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
        y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
        x = x.replace(/^\s+|\s+$/g, "");
        if (x == c_name) {
            return unescape(y);
        }
    }
}

function setCookie(c_name, value, exdays) {
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
    document.cookie = c_name + "=" + c_value;
}

function initCount() {
    if (window.name) {
        count = getCookie("count_" + window.name);// to keep separate count cookies for each window    
    } else {
        window.name = "w_" + (new Date().getTime());
        count = 3;
        setCookie("count_" + window.name, count, null);
    }
}

function decrementAndSave() {
    count--;
    // separate cookie for each window or tab
    setCookie("count_" + window.name, count, null);
}

It's not Perfect but I designed this script to do a 30min countdown and then to change some text during the last few seconds. The only issue with it is that when it gets to 1:00 it starts at 30:60 and I haven't figured out how to fix that yet. This may not work perfectly for what your looking for but it might put you on the right path.

<script>
//add leading zeros
setInterval(function() {
function addZero(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
var x = document.getElementById("timer");
var d = new Date();
var s = (d.getSeconds());
var m = (d.getMinutes());
var a = addZero(30 - m);
var b = addZero(60 - m);
var c = (60 - s);
var z = "<span style='color:red;font-size:50px;'>" + "Break" + "</span>";
var v = "<span style='color:black;font-size:24px;'>" + "Break" + "</span>";
//Decide how much should be subtracted from the time
if (m > 30) {
    y = b;
}
else if (m < 30) {
    y = a;
}
//elements for changing text
if (y < 2 && c < 15) {
    q = z;
}
else {
    q = v;
}

var t = y + (":" + addZero(c) + " Till Station " + (q));
x.innerHTML = t;
}, 250);
</script>


<div align="center" id="timer" style='color:black;font-size:24px;' ></div>