JavaScript countdown is widely used on the Web, such as common group buying and other things worth looking forward. Here are four examples, such as long countdown, hourly countdown, simplest countdown, and stopwatch.
1. Relatively long countdown
There are:
<Script type = "text/javascript"> startclock (); var timerID = null; var timerRunning = false; function showtime () {Today = new Date (); var year = Today. getFullYear (); document. getElementById ("next_yeat "). innerHTML = year + 1; var NowHour = Today. getHours (); var NowMinute = Today. getMinutes (); var NowMonth = Today. getMonth (); var NowDate = Today. getDate (); var NowYear = Today. getYear (); var NowSecond = Today. getSeconds (); if (NowYear <2000) NowYear = 1900 + NowYear; Today = null; hourleft = 23-NowHour Minuteleft = 59-NowMinute Secondleft = 59-NowSecond Yearleft = year-NowYear Monthleft = 12-NowMonth-1 Dateleft = 31-NowDate if (Secondleft <0) {Secondleft = 60 + Secondleft; Minuteleft = Minuteleft-1;} if (Minuteleft <0) {Minuteleft = 60 + Minuteleft; Hourleft = Hourleft-1;} if (Hourleft <0) {Hourleft = 24 + Hourleft; Dateleft = Dateleft-1;} if (Dateleft <0) {Dateleft = 31 + Dateleft; Monthleft = Monthleft-1;} if (Monthleft <0) {Monthleft = 12 + Monthleft; Yearleft = Yearleft-1;} Temp = Yearleft + 'year, '+ Monthleft +' month, '+ Dateleft + 'day,' + Hourleft + 'hour, '+ Minuteleft +', '+ Secondleft + 'second'; document. form1.left. value = Temp; timerID = setTimeout ("showtime ()", 1000); timerRunning = true;} var timerID = null; var timerRunning = false; function stopclock () {if (timerRunning) clearTimeout (timerID); timerRunning = false;} function startclock () {stopclock (); showtime ();} // --> </script>
2. Hourly countdown (short countdown)
<Script type = "text/javascript"> <! -- // One hour, calculated in seconds. You can adjust the time var maxtime = 60*60 function CountDown () {if (maxtime> = 0) {minutes = Math. floor (maxtime/60); seconds = Math. floor (maxtime % 60); msg = "+ minutes +" points "+ seconds +" seconds "; document. all ["timer"]. innerHTML = msg; if (maxtime = 5*60) alert ('note, there are 5 minutes! '); -- Maxtime;} else {clearInterval (timer); alert ("time till, end! "); }} Timer = setInterval (" CountDown () ", 1000); // --> </script>
3. Simplest countdown
<Script Language = "JavaScript"> <! -- Begin var timedate = new Date ("January 14,2012"); var times = "2012"; var now = new Date (); var date = timedate. getTime ()-now. getTime (); var time = Math. floor (date/(1000*60*60*24); if (time> = 0); document. write ("<p> now" + times + "and <B>" + time + "</B> days </p> "); // End --> </script>
4. Stopwatch Function
00: 01: 11: 00
<Script type = "text/javascript"> var normalelapse = 100; var nextelapse = normalelapse; var counter; var startTime; var start = clock. innerText; var finish = "00: 00: 00"; var timer = null; // start running function run () {startB. disabled = true; endB. disabled = false; counter = 0; // initialization Start Time startTime = new Date (). valueOf (); // nextelapse is the scheduled time. The initial time is 100 milliseconds. // note the setInterval function: onTimer starts after nextelapse (milliseconds) expires. Run timer = window. setInterval ("onTimer ()", nextelapse);} // stop running function stop () {startB. disabled = false; endB. disabled = true; window. clearTimeout (timer);} window. onload = function () {endB. disabled = true;} // countdown function onTimer () {if (start = finish) {window. clearInterval (timer); alert ("time is up! "); Return;} var hms = new String (start ). split (":"); var MS = new Number (hms [3]); var s = new Number (hms [2]); var m = new Number (hms [1]); var h = new Number (hms [0]); MS-= 10; if (MS <0) {MS = 90; s-= 1; if (s <0) {s = 59; m-= 1;} if (m <0) {m = 59; h-= 1 ;}} var MS = MS <10? ("0" + MS): MS; var ss = s <10? ("0" + s): s; var sm = m <10? ("0" + m): m; var sh = h <10? ("0" + h): h; start = sh + ":" + sm + ":" + ss + ":" + MS; clock. innerText = start; // clears the last timer window. clearInterval (timer); // obtain the time difference between the time of the self-check system, and obtain the next time the new timer is started. The nextelapse counter ++; var counterSecs = counter * 100; var elapsecs = new Date (). valueOf ()-startTime; var diffSecs = counterSecs-elapsecs; nextelapse = normalelapse + diffSecs; diff. value = counterSecs + "-" + elapseSecs + "=" + diffSecs; next. value = "nextelapse =" + nextelapse; if (nextelapse <0) nextelapse = 0; // start the new timer = window. setInterval ("onTimer ()", nextelapse) ;}</script>