This article explains about the
implementation of the Countdown Timer. We can use this timer for online
interview and something like that.
These are the steps...
Start visual studio and create a new web application. Open the HTML design of
your web page and add the following JavaScript functions before closing the head
tag.
<script
type="text/javascript">
var mins
var secs;
function cd() {
mins = 1 * m("1");
secs = 0 + s(":01");
redo();
}
function m(obj) {
for (var
i = 0; i < obj.length; i++) {
if (obj.substring(i, i + 1) ==
":")
break;
}
return (obj.substring(0, i));
}
function s(obj) {
for (var
i = 0; i < obj.length; i++) {
if (obj.substring(i, i + 1) ==
":")
break;
}
return (obj.substring(i + 1,
obj.length));
}
function dis(mins, secs) {
var disp;
if (mins <= 9) {
disp = " 0";
} else {
disp = " ";
}
disp += mins + ":";
if (secs <= 9) {
disp += "0" + secs;
} else {
disp += secs;
}
return (disp);
}
function redo() {
secs--;
if (secs == -1) {
secs = 59;
mins--;
}
document.cd.disp.value = dis(mins, secs);
if ((mins == 0) && (secs == 0)) {
window.alert("Time is up. Press OK to
continue.");
} else {
cd = setTimeout("redo()",
1000);
}
}
function init() {
cd();
}
window.onload = init; </script>
Now add the following style
tag.
<style>
#txt
{
border: none;
font-family:
verdana;
font-size:
16pt;
font-weight:
bold;
border-right-color:
#FFFFFF;
}
</style>
Add the following HTML code to design the layout of your web page and call the
above JavaScript functions.
<body
ms_positioning="GridLayout">
<form
name="cd">
<center>
<div
style="margin-left:
190px">
<input
id="txt"
readonly="true"
type="text"
value="10:00"
border="0"
name="disp"></div>
</center>
</form>
</body>
Now run your application.