JavaScript ile Bir Digital Saat

Bu örnekte bir digital saat yapıyoruz. Saatteki sayılar için resim kullanılmıştır.

Raşit Fidan

fidanras79@yahoo.com

  1 <html>
  2 	<head>
  3 	<SCRIPT LANGUAGE="JavaScript">
  4 		var seconds1;
  5 		var seconds2;
  6 		var minutes1;
  7 		var minutes2;
  8 		var hours1;
  9 		var hours2;
 10 		function autoClock(){
 11 			var now=new Date();
 12 			var seconds=now.getSeconds();
 13 			var minutes=now.getMinutes();
 14 			var hours=now.getHours();
 15 			seconds1=seconds % 10;
 16 			seconds2=(seconds-seconds1)/10;
 17 			minutes1=minutes % 10;
 18 			minutes2=(minutes-minutes1)/10;
 19 			hours1=hours % 10;
 20 			hours2=(hours-hours1)/10;
 21 			window.document.second1.src="dg"+seconds1+".gif";
 22 			window.document.second2.src="dg"+seconds2+".gif";
 23 			window.document.minute1.src="dg"+minutes1+".gif";
 24 			window.document.minute2.src="dg"+minutes2+".gif";
 25 			window.document.hour1.src="dg"+hours1+".gif";
 26 			window.document.hour2.src="dg"+hours2+".gif";
 27 			setTimeout("autoClock()",1000);
 28 		}
 29 	</SCRIPT>
 30 	<title>Digital Clock</title>
 31 	</head>
 32 	<body bgcolor="black"onLoad="autoClock()">
 33 	<table align=center border=0>
 34 	<tr>
 35 		<td><img src="dg0.gif" name="hour2" width=36 height=45></td>
 36 		<td><img src="dg0.gif" name="hour1" width=36 height=45></td>
 37 		<td><img src="dgc.gif" name="tick3" width=36 height=45></td>
 38 		<td><img src="dg0.gif" name="minute2" width=36 height=45></td>
 39 		<td><img src="dg0.gif" name="minute1" width=36 height=45></td>
 40 		<td><img src="dgc.gif" name="tick2" width=36 height=45></td>
 41 		<td><img src="dg0.gif" name="second2" width=36 height=45></td>
 42 		<td><img src="dg0.gif" name="second1" width=36 height=45></td>
 43 	</tr>
 44 	</table>
 45 </body>
 46 </html>

Açıklama

Saat'te saat,dakika ve saniye gösterilmektedir. hour1 saat'in birler basamağını gösteren image, hour2 onlar basamağını gösteren image'dır. Bunun gibi minute2,minute1,second2,second1 de aynı şekilde isimlendirilmiştir. tick3 ve tick2 ise aralardaki : işareti için kullanılan resimdir.

autoClock() fonksiyonu içinde bulunulan saati,dakikayı ve saniye'yi hesaplamaktadır. Bunu için JavaScript'teki Date nesnesi kullanılmaktadır. Elde edilen değerlerin birler ve onlar basamağındaki değerler elde edilir. Bir sayı'nın 10'e bölümünden kalan sayı birler basamağını verir. Daha sonra bu değer asıl sayıdan çıkarılarak 10'a bölünürse onlar basamağındaki sayı elde edilir. Sayılar elde edildikten sonra gerekli image nesnelerine uygun resimler yerleştirlir.

JavaScript ile Bir Digital Saat

Giriş

Açıklama

Dosya Listesi