リアルタイムで時刻が切り替わるタイプの時計です。
・サンプルを見る
・ソースを保存する (右クリック→「対象をファイルに保存」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;」の数値部分を変更して下さい。
|