Adsence750x90

Tuesday, January 25, 2011

Javascript Countdown timer

This post is mainly to understand, how to program a countdown timer using javascript. if you need to study more about javascript and javascript timer function go to w3schools.com and select Learn JavaScript.

Here I use two funtion to ActivateTimer() and Timer()

check the script

Check the Output


Example URL

Full code file

<HTML>
  <BODY>
  <div>
        <div ID="Label1" style="font-size:24pt;font-weight:bold;"></div>
        <input type="button" onclick="ActivateTimer();" value="Activate" />
        <script language="javascript" type="text/javascript">
            var min = 1;
            var sec = 59;
            var timer;
            var timeon = 0;
            function ActivateTimer() {
                if (!timeon) {
                    timeon = 1;
                    Timer();
                }
            }
            function Timer() {
                var _time = min + ":" + sec;
                document.getElementById("Label1").innerHTML =_time;
                if (_time != "0:0") {
                    if (sec == 0) {
                        min = min - 1;
                        sec = 59;
                    } else {
                        sec = sec - 1;
                    }
                    timer = setTimeout("Timer()", 1000);
                }
                else {
                    alert("Time is Over");
                }
            }
        </script>

    </div>
 </BODY>
</HTML>

3 comments:

Anonymous said...

this post save my time. thanks for d post

Bid Wheel said...

Hi, thanks for this. We started down this road for our auction timers but ended up using a jquery plugin. The ActivateTimer() call should really be unobtrusive but I appreciate this is just an example. Keep the posts coming :)

rohanrj said...

This is really a nice and informative, containing all information and also has a great impact on the new technology. Thanks for sharing it. countdown clocks