6 Adet Kronometre
Kod :
<html>
<head>
<title>Multi Stop Watch</title>
<!-- BEGIN STOP WATCH CODE -->
<style type="text/css">
.stopWatch{ background-color:wheat;
font-family:arial, tahoma;
color:blue;
font-size:14px;
width:200;
border-width:1;
border-color:blue;
border-style:solid;
}
input { font-size:14px;
}
.tbl { border-width:1;
border-color:blue;
border-style:solid;
font-size:18px;
}
.btn { width:12ex; }
.btmLine { border-bottom-style:solid;
border-bottom-width:1;
border-bottomcolor:black;
}
.time { width:9ex;}
.brdr { border-width:1;
border-color:blue;
border-style:solid;
}
#sw1, #sw2, #sw3, #sw4, #sw5, #sw6 { visibility:hidden;
width:200;
}
</style>
<script type="text/javascript">
/* StopWatch Version 1.0
5/7/2004
Public Domain
written by Steven Lorbach
Dynamic Web Technologies, MN
http://www.DynamicWebTec.com
Send comments/suggestions to
steve@DynamicWebTec.com
Feel free to use as you wish. Please keep the
above credits in the web page.
*/
// Sniff, sniff, let's find out which browser and version you're using!
var browser = navigator.appName;
var browserVer = navigator.appVersion;
var showDiv = "";
var hideDiv = "";
if (browser == "Netscape" && browserVer.indexOf("4.7")> -1)
{ layerRef = "document.";
endLayerRef = "";
styleRef = "";
NS4 = true;
hideDiv = "hide";
showDiv = "show";
}
else if (browser == "Netscape" && browserVer.indexOf("5.0")> -1)
{ layerRef = "document.getElementById('";
endLayerRef = "')";
styleRef = ".style";
NS6 = true;
hideDiv = "hidden";
showDiv = "visible";
}
else // if IE
{ layerRef = "document.all['";
endLayerRef = "']";
styleRef = ".style";
IE = true;
hideDiv = "hidden";
showDiv = "visible";
}
// var restart1 = "no";
var mode1 = "paused";var hrs1 = 0;var mins1 = 0;var secs1 = 0;var mSecs1 = 0;
var mode2 = "paused";var hrs2 = 0;var mins2 = 0;var secs2 = 0;var mSecs2 = 0;
var mode3 = "paused";var hrs3 = 0;var mins3 = 0;var secs3 = 0;var mSecs3 = 0;
var mode4 = "paused";var hrs4 = 0;var mins4 = 0;var secs4 = 0;var mSecs4 = 0;
var mode5 = "paused";var hrs5 = 0;var mins5 = 0;var secs5 = 0;var mSecs5 = 0;
var mode6 = "paused";var hrs6 = 0;var mins6 = 0;var secs6 = 0;var mSecs6 = 0;
function startSW(swNo)
{ eval("if(mode" + swNo + "!= 'running') refresh" + swNo + " = setInterval('writeTime(" + swNo + ")',10)");
eval("mode" + swNo + " = 'running'");
}
function pauseSW(swNo) { eval("clearInterval(refresh" + swNo + "); mode" + swNo + "='paused'");}
function resetSW(swNo)
{ eval("hrs" + swNo + "=0");eval("mins" + swNo + "=0");eval("secs" + swNo + "=0"); eval("mSecs" + swNo + "=0");
eval("document.forms['timeForm" + swNo + "'].hours.value = 0");eval("document.forms['timeForm" + swNo + "'].minutes.value = 0");eval("document.forms['timeForm" + swNo + "'].seconds.value = 0");eval("document.forms['timeForm" + swNo + "'].milliseconds.value = 0");
}
function writeTime(swNo)
{ eval("mSecs" + swNo + "+=10");eval("if(mSecs" + swNo + "%1000 == 0 && mSecs" + swNo + "!=0) { secs" + swNo + "++; mSecs" + swNo + "=0;}" );
eval("if(secs"+swNo+"%60==0&&secs"+swNo+"!=0){mins"+swNo+"++;secs"+ swNo+"=0;}");eval("if(mins"+swNo+"%60==0&&mins"+swNo+"!=0){hrs"+swNo+"++;mins"+swNo+"=0;}");
eval("document.forms['timeForm"+swNo+"'].hours.value=hrs"+swNo);eval("document.forms['timeForm"+swNo+"'].minutes.value=mins"+swNo); eval("document.forms['timeForm"+swNo+"'].seconds.value=secs"+swNo); eval("document.forms['timeForm"+swNo+"'].milliseconds.value=mSecs"+swNo);
}
function setCount(theCount)
{ for(var n=1;n<=6;n++) {eval(layerRef + "sw" + n + endLayerRef + styleRef + ".visibility" + " = 'hidden'")};
switch(theCount)
{ case "1":eval(layerRef + "sw1" + endLayerRef + styleRef + ".visibility" + " = 'visible'");break;
case "2":eval(layerRef + "sw1" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw2" + endLayerRef + styleRef + ".visibility" + " = 'visible'");break;
case "3":eval(layerRef + "sw1" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw2" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw3" + endLayerRef + styleRef + ".visibility" + " = 'visible'");break;
case "4":eval(layerRef + "sw1" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw2" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw3" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw4" + endLayerRef + styleRef + ".visibility" + " = 'visible'");break;
case "5":eval(layerRef + "sw1" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw2" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw3" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw4" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw5" + endLayerRef + styleRef + ".visibility" + " = 'visible'");break;
case "6":eval(layerRef + "sw1" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw2" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw3" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw4" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw5" + endLayerRef + styleRef + ".visibility" + " = 'visible'");eval(layerRef + "sw6" + endLayerRef + styleRef + ".visibility" + " = 'visible'");break;
}
}
</script>
</head>
<body>
<form name="swCount">
How many stop watches do you wish to run?<br />
<table>
<tr>
<th class="brdr"><input name="count" type="radio" value="1" onclick="setCount(this.value)">1</input></th>
<th class="brdr"><input name="count" type="radio" value="2" onclick="setCount(this.value)">2</input></th>
<th class="brdr"><input name="count" type="radio" value="3" onclick="setCount(this.value)">3</input></th>
<th class="brdr"><input name="count" type="radio" value="4" onclick="setCount(this.value)">4</input></th>
<th class="brdr"><input name="count" type="radio" value="5" onclick="setCount(this.value)">5</input></th>
<th class="brdr"><input name="count" type="radio" value="6" onclick="setCount(this.value)">6</input></th>
</table>
</form>
<div id="sw1">
<form name="timeForm1">
<table class="stopWatch" border="0" cellspacing="0" class="tbl">
<tr><th colspan="4">Stop Watch 1</th></tr>
<tr><th class="btmLine cWidth">Hr</th><th class="btmLine cWidth">Min</th><th class="btmLine cWidth">Sec</th><th class="btmLine cWidth">Msec</th></tr>
<tr><th><input name="hours" readonly="readonly" class="time " size="6"></th>
<th><input name="minutes" readonly="readonly" class="time" size="6"></th>
<th><input name="seconds" readonly="readonly" class="time" size="6"></th>
<th><input name="milliseconds" readonly="readonly" class="time" size="6"></th>
</tr>
<tr><th colspan="4"><input name="cycle" type="button" value="Start" class="btn" onclick="startSW(1);"/><input name="honk" type="button" value="Pause" class="btn" onclick="pauseSW(1);"/><input name="honk" type="button" value="Reset" class="btn" onclick="resetSW(1);"/></th>
</tr>
</th></tr>
<tr><th colspan="4"> by <a href="http://www.DynamicWebTec.com">DynamicWebTec.com</a></th></tr>
</table>
</form>
</div>
<div id="sw2" >
<form name="timeForm2">
<table class="stopWatch" border="0" cellspacing="0" class="tbl">
<tr><th colspan="4">Stop Watch 2</th></tr>
<tr><th class="btmLine cWidth">Hr</th><th class="btmLine cWidth">Min</th><th class="btmLine cWidth">Sec</th><th class="btmLine cWidth">Msec</th></tr>
<tr><th><input name="hours" readonly="readonly" class="time " size="6"></th>
<th><input name="minutes" readonly="readonly" class="time" size="6"></th>
<th><input name="seconds" readonly="readonly" class="time" size="6"></th>
<th><input name="milliseconds" readonly="readonly" class="time" size="6"></th>
</tr>
<tr><th colspan="4"><input name="cycle" type="button" value="Start" class="btn" onclick="startSW(2);"/><input name="honk" type="button" value="Pause" class="btn" onclick="pauseSW(2);"/><input name="honk" type="button" value="Reset" class="btn" onclick="resetSW(2);"/></th>
</tr>
</th></tr>
<tr><th colspan="4"> by <a href="http://www.DynamicWebTec.com">DynamicWebTec.com</a></th></tr>
</table>
</form>
</div>
<div id="sw3" >
<form name="timeForm3">
<table class="stopWatch" border="0" cellspacing="0" class="tbl">
<tr><th colspan="4">Stop Watch 3</th></tr>
<tr><th class="btmLine cWidth">Hr</th><th class="btmLine cWidth">Min</th><th class="btmLine cWidth">Sec</th><th class="btmLine cWidth">Msec</th></tr>
<tr><th><input name="hours" readonly="readonly" class="time " size="6"></th>
<th><input name="minutes" readonly="readonly" class="time" size="6"></th>
<th><input name="seconds" readonly="readonly" class="time" size="6"></th>
<th><input name="milliseconds" readonly="readonly" class="time" size="6"></th>
</tr>
<tr><th colspan="4"><input name="cycle" type="button" value="Start" class="btn" onclick="startSW(3);"/><input name="honk" type="button" value="Pause" class="btn" onclick="pauseSW(3);"/><input name="honk" type="button" value="Reset" class="btn" onclick="resetSW(3);"/></th>
</tr>
</th></tr>
<tr><th colspan="4"> by <a href="http://www.DynamicWebTec.com">DynamicWebTec.com</a></th></tr>
</table>
</form>
</div>
<div id="sw4">
<form name="timeForm4">
<table class="stopWatch" border="0" cellspacing="0" class="tbl">
<tr><th colspan="4">Stop Watch 4</th></tr>
<tr><th class="btmLine cWidth">Hr</th><th class="btmLine cWidth">Min</th><th class="btmLine cWidth">Sec</th><th class="btmLine cWidth">Msec</th></tr>
<tr><th><input name="hours" readonly="readonly" class="time " size="6"></th>
<th><input name="minutes" readonly="readonly" class="time" size="6"></th>
<th><input name="seconds" readonly="readonly" class="time" size="6"></th>
<th><input name="milliseconds" readonly="readonly" class="time" size="6"></th>
</tr>
<tr><th colspan="4"><input name="cycle" type="button" value="Start" class="btn" onclick="startSW(4);"/><input name="honk" type="button" value="Pause" class="btn" onclick="pauseSW(4);"/><input name="honk" type="button" value="Reset" class="btn" onclick="resetSW(4);"/></th>
</tr>
</th></tr>
<tr><th colspan="4"> by <a href="http://www.DynamicWebTec.com">DynamicWebTec.com</a></th></tr>
</table>
</form>
</div>
<div id="sw5">
<form name="timeForm5">
<table class="stopWatch" border="0" cellspacing="0" class="tbl">
<tr><th colspan="4">Stop Watch 5</th></tr>
<tr><th class="btmLine cWidth">Hr</th><th class="btmLine cWidth">Min</th><th class="btmLine cWidth">Sec</th><th class="btmLine cWidth">Msec</th></tr>
<tr><th><input name="hours" readonly="readonly" class="time " size="6"></th>
<th><input name="minutes" readonly="readonly" class="time" size="6"></th>
<th><input name="seconds" readonly="readonly" class="time" size="6"></th>
<th><input name="milliseconds" readonly="readonly" class="time" size="6"></th>
</tr>
<tr><th colspan="4"><input name="cycle" type="button" value="Start" class="btn" onclick="startSW(5);"/><input name="honk" type="button" value="Pause" class="btn" onclick="pauseSW(5);"/><input name="honk" type="button" value="Reset" class="btn" onclick="resetSW(5);"/></th>
</tr>
</th></tr>
<tr><th colspan="4"> by <a href="http://www.DynamicWebTec.com">DynamicWebTec.com</a></th></tr>
</table>
</form>
</div>
<div id="sw6">
<form name="timeForm6">
<table class="stopWatch" border="0" cellspacing="0" class="tbl">
<tr><th colspan="4">Stop Watch 6</th></tr>
<tr><th class="btmLine cWidth">Hr</th><th class="btmLine cWidth">Min</th><th class="btmLine cWidth">Sec</th><th class="btmLine cWidth">Msec</th></tr>
<tr><th><input name="hours" readonly="readonly" class="time " size="6"></th>
<th><input name="minutes" readonly="readonly" class="time" size="6"></th>
<th><input name="seconds" readonly="readonly" class="time" size="6"></th>
<th><input name="milliseconds" readonly="readonly" class="time" size="6"></th>
</tr>
<tr><th colspan="4"><input name="cycle" type="button" value="Start" class="btn" onclick="startSW(6);"/><input name="honk" type="button" value="Pause" class="btn" onclick="pauseSW(6);"/><input name="honk" type="button" value="Reset" class="btn" onclick="resetSW(6);"/></th>
</tr>
</th></tr>
<tr><th colspan="4"> by <a href="http://www.DynamicWebTec.com">DynamicWebTec.com</a></th></tr>
</table>
</form>
</div>
<!-- END STOP WATCH CODE -->
</body>
