Web calculator && Easy Web clock && countdown clock

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">Body,div,p,ul,li,input{margin:0;padding:0;} Ul{list-style-Type:none;} A{color: #fff; Outline:none;text-Decoration:none;} Body{font:24px/1.5 Arial;} #calc {position:relative;width:300px;background: #000; margin:10px Auto;} #calc P{color: #fff; text-align:right;font:12px/20px arial;padding:0 5px;} #calc. f-text{border:0;width:290px;height:84px;text-align:right;font:700 50px/84px Arial;background:url (img/ inputbg.jpg) repeat-x;padding:05px;} #calc Ul{position:relative;overflow:hidden;zoom:1;background:url (img/bg.jpg);p adding:0 0 17px 8px;} #calc ul li{float: left;width:63px;height:41px;margin:17px 10px 0 0;} #calc ul Li A{display:block;width:63px;height:41px;line-height:41px;text-align:center;background:url (Img/btn.png) no-repeat;} #calc ul Li A:hover{background-position:-63px 0;} #calc ul li.btn-1 a{background-position:0-41px;} #calc ul li.btn-1 a:hover{background-position:-63px-41px;} #calc ul li.btn-2{position:absolute;top:174px;right:0; height:99px;} #calc ul li.btn-2 a{height:99px;line-height:99px;background-position:0-164px;} #calc ul li.btn-2 a:hover{background-position:-63px-164px;} #calc ul li.btn-3{width:136px;} #calc ul li.btn-3 a{width:136px;background-position:0-82px;} #calc ul li.btn-3 a:hover{background-position:0-123px;} #formula {position:absolute;top:20px;background:none;border:0;font:700 12px/1.5 arial;width:280px;padding:3px 15px 0 5px;text-align:right;} </style><script>window.onload=function (){    varOcalc = document.getElementById ("Calc"); varAA = Ocalc.getelementsbytagname ("a"); varAinput = ocalc.getelementsbytagname ("input") [0]; varOformula = document.getElementById ("formula"); vars =false; vari = 0;  for(i = 0; i < aa.length; i++) {Aa[i].onfocus=function ()        {             This. blur ()}; Aa[i].onclick=function ()        {            Switch( This. InnerHTML) {                 CaseC: Ainput.value= 0; Oformula.value= "";  Break;  Case"%": Count ("%")                     Break;  Case÷: Count ("/")                     Break;  Case"X": Count ("*")                     Break;  Case"-": Count ("-")                     Break;  Case"+": Count ("+")                     Break;  Case"=": S|| (Oformula.value + =ainput.value); Ainput.value= eval (OFormula.value.replace (/\%\/\*\-\+/, ")); Ainput.value= AInput.value.substr (0,10). Replace ("NaN", 0); S=true;  Break;  Case".":                    if(AInput.value.search (/[\.\%\/\*\-\+]/)! =-1)                     Break; default: S&& (ainput.value = 0, Oformula.value = "", s =false); AInput.value.length< && (Ainput.value = (Ainput.value + This. InnerHTML). Replace (/^[0\%\/\*\-\+] (\d)/, "$")); }        }        }        functionCount (a) {if(s) {Oformula.value= Ainput.value +A; Ainput.value=A; S=false; }        Else        {            /[\%\/\*\-\+]$/.test (ainput.value) | | (Oformula.value + =ainput.value); Ainput.value=A; /[\%\/\*\-\+]$/.test (oformula.value) | | (Oformula.value + =ainput.value); Oformula.value= OFormula.value.slice ( -1)! = a? OFormula.value.replace (/.$/, a): Oformula.value}}}</script><title> Web Calculator </title>
Simple Web Clock
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">Body,div{margin:0;padding:0;} Body{color: #fff; font:16px/1.5 \5fae\8f6f\96c5\9ed1;} #clock {width:300px;text-align:center;background: #1a1a1a; margin:10px auto;padding:20px 0;} span{color:#000;width:80px;line-height:2;background: #fbfbfb; border:2px solid #b4b4b4; margin:0 10px;padding:010px;}</style><script>window.onload=function (){    varOclock = document.getElementById ("Clock"); varAspan = Oclock.getelementsbytagname ("span"); SetInterval (Gettimes,1000);    Gettimes (); functionGettimes () {varOdate =NewDate (); varAdate =[Odate.gethours (), Odate.getminutes (), Odate.getseconds ()];  for(varIinchadate) aspan[i].innerhtml =format (Adate[i])}functionFormat (a) {returnA.tostring (). Replace (/^ (\d) $/, "0$1")        }}</script>
Countdown clock
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">Body,div{margin:0;padding:0;} Body{color: #fff; font:16px/1.5 \5fae\8f6f\96c5\9ed1;} #countdown {width:300px;text-align:center;background: #1a1a1a; margin:10px auto;padding:20px 0;} Input{border:0;width:283px;height:50px;cursor:pointer;margin-top:20px;background:url (Img/btn-1.png) no-repeat;} Input.cancel{background-position:0-50px;} span{color:#000;width:80px;line-height:2;background: #fbfbfb; border:2px solid #b4b4b4; margin:0 10px;padding:010px;}</style><script>window.onload=function (){    varOcountdown = document.getElementById ("Countdown"); varAinput = ocountdown.getelementsbytagname ("input") [0]; varTimer =NULL; Ainput.onclick=function ()    {         This. ClassName = = ""? (Timer = setinterval (updatetime, 1000), UpdateTime ()): (Clearinterval (timer));  This. ClassName = This. ClassName = = '? "Cancel": ";        }; functionFormat (a) {returnA.tostring (). Replace (/^ (\d) $/, ' 0$1 ')    }        functionUpdateTime () {varAspan = Ocountdown.getelementsbytagname ("span"); varOremain = Aspan[0].innerhtml.replace (/^0/, ") * + parseint (aspan[1].innerhtml.replace (/^0/, '))); if(Oremain <= 0) {clearinterval (timer); return} oremain--; aspan[0].innerhtml = Format (parseint (OREMAIN/60)); Oremain%= 60; aspan[1].innerhtml =Format (parseint (Oremain)); }}</script>seconds<input type= "button" value= ""/></div></body>
Web calculator && Easy Web clock && countdown clock