現在時刻を画像で表示するスクリプトです。
・サンプルを見る
・ソースを保存する
（右クリック→「対象をファイルに保存」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
function jikann()
{
jikoku=new Date();
jikan=String(jikoku.getHours());
hunn=String(jikoku.getMinutes());
pic=new Array();
for(i=0;i<10;i++)
{
pic[i]=new Image();
pic[i].src=i+".gif";
}
if(jikan.length==1)
{
document.images["ji1"].src=pic[0].src;
document.images["ji2"].src=pic[jikan].src;
}
else if(jikan.length==2)
{
document.images["ji1"].src=pic[jikan.charAt(0)].src;
document.images["ji2"].src=pic[jikan.charAt(1)].src;
}
if(hunn.length==1)
{
document.images["hunn1"].src=pic[0].src;
document.images["hunn2"].src=pic[hunn].src;
}
else if(hunn.length==2)
{
document.images["hunn1"].src=pic[hunn.charAt(0)].src;
document.images["hunn2"].src=pic[hunn.charAt(1)].src;
}
}
//-->
</script>
</head>
<body onLoad="jikann();">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td><img src="0.gif" name="ji1" width="25" height="30"></td>
<td><img src="0.gif" name="ji2" width="25" height="30"></td>
<td><img src="coron.gif" width="25" height="30"></td>
<td><img src="0.gif" name="hunn1" width="25" height="30"></td>
<td><img src="0.gif" name="hunn2" width="25" height="30"></td>
</tr></table>
</body></html>
[ 解説 ]
まず０〜９までの画像と「：」の画像を用意します。
画像の置き場所は、HTMLと同じディレクトリに設置して下さい。
０〜９までの画像を作るときに、必ず名前を数字で付けて下さい。
「0」の画像ならば「0.gif」、「1」の画像ならば「1.gif」と言うように。
下から８〜４行目に、画像タグがあります。現在は幅が２５、高さが３０で
設定しています。これは使用する画像によって、お好きなサイズに変更して下さい。
他にボディタグへの属性なども変えて下さって結構です。
|
