WEST MiRa(1,739 Byte)
JavaScript(1,601 Byte)

■ JavaScript - サンプル集(257種類) - フォーム
   - リアルタイム時計表示

リアルタイムで時刻が切り替わるタイプの時計です。

サンプルを見る
ソースを保存する
(右クリック→「対象をファイルに保存」or「リンクを名前を付けて保存」して下さい。)
ソースを見る
解説を見る





[ ソース ]

<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

<script language="JavaScript">
<!--//Copyright (C) WEST MiRa http://www.west-mira.jp

	//文字を表示する欄の横幅を指定
	my_width=250;

	//文字を表示する欄の横位置を指定
	x_iti=300;
	//文字を表示する欄の縦位置を指定
	y_iti=130;

	function tokei()
		{
		a=new Date();
		b=a.getMinutes();  c=a.getSeconds();  d=a.getHours();
		if(b<10)b="0"+b;   if(c<10)c="0"+c;   if(d<10)d="0"+d;
		e=0;
		moji="<strong>現在時刻 "+d+":"+b+":"+c+"</strong>";

		if(document.layers)
			{
			document.layers["lay0"].moveTo(x_iti,y_iti);
			document.layers["lay0"].clip.width=my_width;
			document.layers["lay0"].document.open();
			document.layers["lay0"].document.write(moji);
			document.layers["lay0"].document.close();
			}

		else if((document.getElementById) && (!document.all))
			{
			document.getElementById("lay0").style.pixelLeft=x_iti;
			document.getElementById("lay0").style.pixelTop=y_iti;
			document.getElementById("lay0").innerHTML=moji;
			document.getElementById("lay0").style.width=my_width;
			}

		else if(document.all)
			{
			document.all("lay0").style.pixelLeft=x_iti;
			document.all("lay0").style.pixelTop=y_iti;
			document.all("lay0").innerHTML=moji;
			document.all("lay0").style.width=my_width;
			}

		clearTimeout(e);
		e=setTimeout('tokei()',1000);
		}

//-->
</script>

</head>

<body onLoad="tokei();">

<span id="lay0" style="position:absolute;visibility:visible;"></span><br>
 ・
 ・
 ・

</body></html>


[ 解説 ]

時計は「現在時刻」の文字と一緒に表示されていますが、 文字を消したい場合は、上から10行目の「現在時刻」の文字を削除して下さい。

また文字サイズや色を変更したい場合は、その部分にボールドタグがあると思いますが、 同じようにお好きなタグを書いてください。

閉じるタグは、同じ行の後ろを見れば書いてありますね。
そこに追加して下さい。

時計が表示される位置を変更するには、 上から16行目の「x_iti=300;」と17行目の「y_iti=130;」の数値部分を変更して下さい。


バナー、リンクについて  ,   利用規約  ,   ヘルプ

Copyright (C) 1998-2007 WEST MiRa. All rights reserved.