うさのJavaScript講座 - Blog館 - | 本日日付を画像で表示☆サンプル集１

日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

本日日付を画像で表示☆サンプル集１－６９を追加しました。
もともとサンプル集１－７に入っていたのですが、最近のブラウザではgetYearでなくgetFullYearで年度を取得するので、その1行を変更したものです。サンプルはそのままHTML/XHTML内部にも記述できますし、JSファイルにしていただいても結構です。ご自由にカスタマイズしてくださいませ。
ブログにももちろん使えますのでご利用くださいね♪

うさのJavaScript講座・サンプル集1-69をこのページに貼り付けています。

ソースはこちら↓

<script language="javascript">
<!--
//------------------------------------------------------------
//javascript by ＠うさ http://www.usagi-js.com/
//------------------------------------------------------------

	//変数宣言
	var dtToday = new Date;
	var strYear;
	var strMonth;
	var strDate;
	//０から９までの画像を用意してください。
	//画像のURLを宣言します。
	var strPicture = new Array("../images/number/orange0_on.gif",
		"../images/number/orange1_on.gif",
		"../images/number/orange2_on.gif",
		"../images/number/orange3_on.gif",
		"../images/number/orange4_on.gif",
		"../images/number/orange5_on.gif",
		"../images/number/orange6_on.gif",
		"../images/number/orange7_on.gif",
		"../images/number/orange8_on.gif",
		"../images/number/orange9_on.gif");

	//年月日を取得
	strYear = dtToday.getFullYear();
	strMonth = dtToday.getMonth() + 1;
	strDate = dtToday.getDate();

	//桁数を整理します
	if (strMonth < 10)
	{
		strMonth = "0" + strMonth;
	}
	if (strDate < 10)
	{
		strDate = "0" + strDate;
	}

	//数字に画像を当てるための準備です。
	var imgYear, imgMonth, imgDate;
	imgYear = strYear.toString();
	imgMonth = strMonth.toString();
	imgDate = strDate.toString();

	//ここから表示
	document.write("<img src='"+strPicture[imgYear.substring(0,1)]+"'>"+"<img src='"+strPicture[imgYear.substring(1,2)]+"'>"+"<img src='"+strPicture[imgYear.substring(2,3)]+"'>"+"<img src='"+strPicture[imgYear.substring(3,4)]+"'>"+"年<br>");
	document.write("<img src='"+strPicture[imgMonth.substring(0,1)]+"'>"+"<img src='"+strPicture[imgMonth.substring(1,2)]+"'>"+"月");
	document.write("<img src='"+strPicture[imgDate.substring(0,1)]+"'>"+"<img src='"+strPicture[imgDate.substring(1,2)]+"'>"+"日");
//-->
</script>

うさのJavaScript講座 - Blog館 -

このサイトでは「うさのJavaScript講座」の情報やブログにも使えるJavaScriptサンプルをお届けしています♪

Calendar

うさゾン [うさ+Amazon]

Links

Category Archives

Archives

本日日付を画像で表示☆サンプル集１－６９を追加しました

タグ:

trackbacks

comments

comment form

Recent Entries

Feed

Inside
うさのJavaScript講座

Powered by

copyright (c) ＠うさ