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

■ JavaScript - サンプル集(257種類) - 時間
   - カレンダーVer2

今月のカレンダーを表示するスクリプトVer2です。

機能は、 ・祝日表示
・土曜を青色に、日曜を赤色、当日を目立つように配色
・配色は好きな色を指定可能
・祝日以外のクリスマスや雛祭りなどの記念日もフォロー
です。

サンプルを見る
ソースを保存する
(右クリック→「対象をファイルに保存」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

	//曜日名
	youbis=new Array('日','月','火','水','木','金','土');

	//振り替え休日時に表示したい文字列
	hurikae_moji='振り替え休日';

	//日曜日の文字色
	sunday_color=<#b54b44<;

	//土曜日の文字色
	saturday_color=<#3f6a90<;

	//今日の文字色
	today_color=<#f0e9d5<;

	//今日の背景色
	today_bgcolor=<#82ad41<;

	//カレンダー全体の背景色
	table_bgcolor=<#f4e8d1<;

	//曜日名欄の背景色
	th_bgcolor=<#ffa96f<;

	//各日付欄の横幅
	td_width=50;

	//各日付欄の高さ
	td_height=50;

	//文字のサイズ
	font_size=14;


	syukujitu=new Array();
	for(i=0; i<22; i++)syukujitu[i]=new Array();
	syukujitu[0][0]=1;
	syukujitu[0][1]=1;
	syukujitu[0][2]='元日';
	syukujitu[0][3]=0;
	syukujitu[0][4]=0;

	syukujitu[1][0]=1;
	syukujitu[1][1]=0;
	syukujitu[1][2]='成人の日';
	syukujitu[1][3]=0;
	syukujitu[1][4]='2,1';

	syukujitu[2][0]=2;
	syukujitu[2][1]=11;
	syukujitu[2][2]='建国記念日';
	syukujitu[2][3]=0;
	syukujitu[2][4]=0;

	syukujitu[3][0]=3;
	syukujitu[3][1]=20;
	syukujitu[3][2]='春分の日';
	syukujitu[3][3]=0;
	syukujitu[3][4]=0;

	syukujitu[4][0]=4;
	syukujitu[4][1]=29;
	syukujitu[4][2]='みどりの日';
	syukujitu[4][3]=0;
	syukujitu[4][4]=0;

	syukujitu[5][0]=5;
	syukujitu[5][1]=3;
	syukujitu[5][2]='憲法記念日';
	syukujitu[5][3]=0;
	syukujitu[5][4]=0;

	syukujitu[6][0]=5;
	syukujitu[6][1]=4;
	syukujitu[6][2]='国民の休日';
	syukujitu[6][3]=1;
	syukujitu[6][4]=0;

	syukujitu[7][0]=5;
	syukujitu[7][1]=5;
	syukujitu[7][2]='こどもの日';
	syukujitu[7][3]=0;
	syukujitu[7][4]=0;

	syukujitu[8][0]=7;
	syukujitu[8][1]=20;
	syukujitu[8][2]='海の日';
	syukujitu[8][3]=0;
	syukujitu[8][4]=0;

	syukujitu[9][0]=9;
	syukujitu[9][1]=15;
	syukujitu[9][2]='敬老の日';
	syukujitu[9][3]=0;
	syukujitu[9][4]=0;

	syukujitu[10][0]=9;
	syukujitu[10][1]=23;
	syukujitu[10][2]='秋分の日';
	syukujitu[10][3]=0;
	syukujitu[10][4]=0;

	syukujitu[11][0]=10;
	syukujitu[11][1]=0;
	syukujitu[11][2]='体育の日';
	syukujitu[11][3]=0;
	syukujitu[11][4]='2,1';

	syukujitu[12][0]=11;
	syukujitu[12][1]=3;
	syukujitu[12][2]='文化の日';
	syukujitu[12][3]=0;
	syukujitu[12][4]=0;

	syukujitu[13][0]=11;
	syukujitu[13][1]=23;
	syukujitu[13][2]='勤労感謝の日';
	syukujitu[13][3]=0;
	syukujitu[13][4]=0;

	syukujitu[14][0]=12;
	syukujitu[14][1]=23;
	syukujitu[14][2]='天皇誕生日';
	syukujitu[14][3]=0;
	syukujitu[14][4]=0;

	syukujitu[15][0]=2;
	syukujitu[15][1]=14;
	syukujitu[15][2]='バレンタインデー';
	syukujitu[15][3]=-1;
	syukujitu[15][4]=0;

	syukujitu[16][0]=3;
	syukujitu[16][1]=3;
	syukujitu[16][2]='雛祭り';
	syukujitu[16][3]=-1;
	syukujitu[16][4]=0;

	syukujitu[17][0]=3;
	syukujitu[17][1]=14;
	syukujitu[17][2]='ホワイトデー';
	syukujitu[17][3]=-1;
	syukujitu[17][4]=0;

	syukujitu[18][0]=7;
	syukujitu[18][1]=7;
	syukujitu[18][2]='七夕';
	syukujitu[18][3]=-1;
	syukujitu[18][4]=0;

	syukujitu[19][0]=12;
	syukujitu[19][1]=25;
	syukujitu[19][2]='クリスマス';
	syukujitu[19][3]=-1;
	syukujitu[19][4]=0;

	syukujitu[20][0]=5;
	syukujitu[20][1]=0;
	syukujitu[20][2]='母の日';
	syukujitu[20][3]=-1;
	syukujitu[20][4]='2,0';

	syukujitu[21][0]=6;
	syukujitu[21][1]=0;
	syukujitu[21][2]='父の日';
	syukujitu[21][3]=-1;
	syukujitu[21][4]='3,0';

	hiniti=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
	nitiyou=0;  doyou=0; daini_han=0;  yasumi_moji=<<;  hurikae=0; yasumi=0;
	function calendar(dore)
		{
		jikoku=new Date();
		nenn=jikoku.getFullYear();  tuki=jikoku.getMonth();
		kyou=jikoku.getDate();      youbi=jikoku.getDay();
		my_week=0;

		if(nenn%4==0)hiniti[1]=29;
		else hiniti[1]=28;
		tuitati=new Date(nenn+</<+(tuki+1)+</1<);
		tuitati_youbi=tuitati.getDay();

		kekka_moji='<strong>'+nenn+'/'+(tuki+1)+'<\/strong>';
		table_width=td_width*7+(3*6);
		kekka_moji+='<table border=<1< width=<'+table_width+'< cellpadding=<2< bgcolor=<'+table_bgcolor+'<><tr>';
		for(i=0; i<youbis.length; i++)
			{
			kekka_moji+='<th width=<'+td_width+'< bgcolor=<'+th_bgcolor+'<>';
			if(i==0)kekka_moji+='<font style=<font-size:'+font_size+'pt;< color=<'+sunday_color+'< size=<4<>'+youbis[i];
			else if(i==6)kekka_moji+='<font style=<font-size:'+font_size+'pt;< color=<'+saturday_color+'< size=<4<>'+youbis[i];
			else kekka_moji+='<font style=<font-size:'+font_size+'pt;< size=<4<>'+youbis[i];
			kekka_moji+='<\/font><\/th>';
			}
		kekka_moji+='<\/tr><tr align=<center< valign=<top<>';

		j=1;
		for(i=0; i<7; i++)
			{
			if(i<tuitati_youbi)kekka_moji+='<td width=<'+td_width+'< height=<'+td_height+'<><br><\/td>';
			else 
				{
				syukujitu_hyouji();
				daily_hyouji();
				daini_han=1;  j++;
				}

			yasumi_moji=<<;
			yasumi=0;
			if(hurikae==1)hurikae++;
			else hurikae=0;
			}
		kekka_moji+='<\/tr>';

		i=0;
		while(j<=hiniti[tuki])
			{
			kekka_moji+='<tr align=<center< valign=<top<>';
			while(i<youbis.length+my_week)
				{
				if(j<=hiniti[tuki])
					{
					syukujitu_hyouji();
					daily_hyouji();
					j++; i++;
					}

				else {kekka_moji+='<td width=<'+td_width+'< height=<'+td_height+'<><br><\/td>'; j++; i++;}

				yasumi_moji=<<;
				yasumi=0;
				if(hurikae==1)hurikae++;
				else hurikae=0;
				}

			kekka_moji+='<\/tr>';
			my_week+=7;
			}

		kekka_moji+='<\/table>';

		document.write(kekka_moji);
		}

	function daily_hyouji()
		{
		kekka_moji+='<td width=<'+td_width+'< height=<'+td_height+'< valign=<top<';
		if(hurikae==2)kekka_moji+='><font style=<font-size:'+font_size+'pt;< color=<'+sunday_color+'< size=<4<>';
		else if(j==kyou)kekka_moji+=' bgcolor=<'+today_bgcolor+'<><font style=<font-size:'+font_size+'pt;< color=<'+today_color+'< size=<4<>';
		else if(yasumi==1 || j%7==nitiyou)kekka_moji+='><font style=<font-size:'+font_size+'pt;< color=<'+sunday_color+'< size=<4<>';
		else if(j%7==doyou)kekka_moji+='><font style=<font-size:'+font_size+'pt;< color=<'+saturday_color+'< size=<4<>';
		else kekka_moji+='><font style=<font-size:'+font_size+'pt;< size=<4<>';

		if(hurikae==2)kekka_moji+=j+'<\/font><br><font size=<1< color=<'+sunday_color+'<>'+hurikae_moji+'<\/font><\/td>';
		else kekka_moji+=j+'<\/font>'+yasumi_moji+'<\/td>';
		}

	function syukujitu_hyouji()
		{
		doyou=7-tuitati_youbi;
		nitiyou=7-tuitati_youbi+1;
		if(doyou==7){doyou-=7; nitiyou-=7;}
		if(nitiyou==7){nitiyou-=7;}

		for(l=0; l<syukujitu.length; l++)
			{
			if(eval(tuki+1)==syukujitu[l][0])
				{
				if(j==syukujitu[l][1])
					{
					if(syukujitu[l][3] > -1)
						{yasumi_moji='<br><font size=<1< color=<'+sunday_color+'<>'+syukujitu[l][2]+'<\/font>';
						yasumi=1;}
					else 
						{yasumi_moji='<br><font size=<1<>'+syukujitu[l][2]+'<\/font>';
						yasumi=0;}
					syuku_han=7-tuitati_youbi+1;
					if(syukujitu[l][3]==0 && j%7==nitiyou)hurikae=1;
					}
				else if(syukujitu[l][1]==0)
					{
					datas=new Array();
					datas=syukujitu[l][4].split(<,<);
					if(tuitati_youbi>0)syuku_han=7-tuitati_youbi+eval(datas[1])+1;
					else syuku_han=eval(datas[1])+1;
					syuku_han+=(eval(datas[0])-1)*7;
					if(j==syuku_han)
						{
						if(syukujitu[l][3] > -1)
							{yasumi_moji='<br><font size=<1< color=<'+sunday_color+'<>'+syukujitu[l][2]+'<\/font>';
							yasumi=1;}
						else 
							{yasumi_moji='<br><font size=<1<>'+syukujitu[l][2]+'<\/font>';
							yasumi=0;}
						}
					}
				}
			}
		}

//-->
</script>

</head>

<body>

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

	calendar();

//-->
</script>

</body></html>


[ 解説 ]

ソースを丸ごとコピーペーストして下さい。
変更可能箇所はソース内に注意書きをしてありますので、 それに沿ってご変更下さい。


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

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