WEST MiRa(1,739 Byte)
JavaScript(1,601 Byte)
[ JavaScriptの目次 ]
▲トップページ
▲基礎知識
▲基本操作
▲その他
▲サンプル集(257種類)
▲その他

[ 他の一覧 ]
◆↑ホームへ

 

■ JavaScript - サンプル集(257種類) - 音楽
　　 - 日付によって変わる曲

設定した日付の場合、指定した曲が表示されるスクリプトです。
例えばお正月にはお正月用曲を表示させる、クリスマスにはクリスマス曲を表示させる、 と言った使い道があります。

サンプルでは1月1日、3月3日、5月5日、12月25日の場合は曲が変わるように設定しています。
マシンの日付を色々と変更して確認してみてください。

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




[ ソース ] 

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

<body>

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

	MyMon=new Array();
	MyDay=new Array();
	MyData=new Array();

	//データ1を表示したい月を指定する
	MyMon[0]=1;
	//データ1を表示したい日を指定する
	MyDay[0]=1;
	//データ1の曲を指定する
	MyData[0]='../../sound/do.mid';


	//データ2を表示したい月を指定する
	MyMon[1]=3;
	//データ2を表示したい日を指定する
	MyDay[1]=3;
	//データ2の曲を指定する
	MyData[1]='../../sound/do2.mid';


	//データ3を表示したい月を指定する
	MyMon[2]=5;
	//データ3を表示したい日を指定する
	MyDay[2]=5;
	//データ3の曲を指定する
	MyData[2]='../../sound/fa.mid';


	//データ4を表示したい月を指定する
	MyMon[3]=12;
	//データ4を表示したい日を指定する
	MyDay[3]=25;
	//データ4の曲を指定する
	MyData[3]='../../sound/mi.mid';


	//デフォルトの曲を指定する
	Defaultdata='../../sound/so.mid';

	hiduke=new Date();
	tuki=hiduke.getMonth()+1;
	kyou=hiduke.getDate();
	for(i=0; i < MyMon.length; i++)
		if(MyMon[i] == tuki && MyDay[i] == kyou)
		{
		document.write('<embed src="'+MyData[i]+'" type="audio/x-midi" autostart="true" >');
		break;
		}
	if(i >= MyMon.length)
		document.write('<embed src="'+Defaultdata+'" type="audio/x-midi" autostart="true">');

//-->
</script>

<noscript>
<!-- JavaScript非対応ブラウザ用の曲を指定する -->
	<embed src="../../sound/so.mid" type="audio/x-midi" autostart="true">
</noscript>

</body></html>

[ 解説 ]

まず、期日とデータを設定します。

設定するデータは、
曲を変更する月
曲を変更する日
曲URL
の3つで成り立っています。

サンプルデータを見てみましょう。

MyMon[0]=1;
MyDay[0]=1;
MyData[0]='../sound/do.mid';

まず1行目の「MyMon[0]=1;」で曲を変更する月の「1」を指定しています。
次に2行目の「MyDay[0]=1;」で曲を変更する日の「2」を指定しています。
最後に3行目の「MyData[0]='../sound/do.mid';」で曲URLを指定しています。

同じ書式に従って、データは書き替えてください。
必ず月、日、曲URLの3つを書き替えて下さい。

もしデータを減らしたい場合は、データを1つ分（すなわち3行）をまとめて消去します。

例えばサンプルからデータを1つ削除する場合は、以下のようになります。

変更前変更後
MyMon[0]=1;
MyDay[0]=1;
MyData[0]='../sound/do.mid';

MyMon[1]=3;
MyDay[1]=3;
MyData[1]='../sound/do2.mid';

MyMon[2]=5;
MyDay[2]=5;
MyData[2]='../sound/fa.mid';

MyMon[3]=12;
MyDay[3]=25;
MyData[3]='../sound/mi.mid';

 MyMon[0]=1;
MyDay[0]=1;
MyData[0]='../sound/do.mid';

MyMon[1]=3;
MyDay[1]=3;
MyData[1]='../sound/do2.mid';

MyMon[2]=5;
MyDay[2]=5;
MyData[2]='../sound/fa.mid';


反対に、データを増やす場合は削除する場合と逆でデータを増やしていきます。

ただし、この時注意点が1つあります。

データの先頭部分を見てみますと、数値部分がありますね。
各データのまとまりは、全て同じ数値が入っています。
そして次のデータになると、数値が1つ繰り上がっています。

それと同じ要領で、必ず数値部分を1つずつ増やしていく必要があります。

例えばサンプルにデータを1つ追加すると、以下のようになります。

変更前変更後
MyMon[0]=1;
MyDay[0]=1;
MyData[0]='../sound/do.mid';

MyMon[1]=3;
MyDay[1]=3;
MyData[1]='../sound/do2.mid';

MyMon[2]=5;
MyDay[2]=5;
MyData[2]='../sound/fa.mid';

MyMon[3]=12;
MyDay[3]=25;
MyData[3]='../sound/mi.mid';

 MyMon[0]=1;
MyDay[0]=1;
MyData[0]='../sound/do.mid';

MyMon[1]=3;
MyDay[1]=3;
MyData[1]='../sound/do2.mid';

MyMon[2]=5;
MyDay[2]=5;
MyData[2]='../sound/fa.mid';

MyMon[3]=12;
MyDay[3]=25;
MyData[3]='../sound/mi.mid';

MyMon[4]=10;
MyDay[4]=1;
MyData[4]='../sound/ra.mid';

次に、指定日以外の通常時に表示する曲を指定します。

上から26行目にある「Defaultdata='../sound/so.mid';」に通常時に表示させたい曲URLを指定してください。


最後に、JavaScriptが無効の人用に曲を設定します。

下から4行目にある
<embed src="../sound/so.mid" type="audio/x-midi" autostart="true">
部分を変更してください。

また、各曲以外の属性は、お好きなようにカスタマイズしてください。

指定日の日の属性は、下から13行目にある
document.write('<embed src="'+MyData[i]+'" type="audio/x-midi" autostart="true" >');
部分を変更します。

指定日以外の属性は、下から9行目にある
document.write('<embed src="'+Defaultdata+'" type="audio/x-midi" autostart="true">');
を変更します。

例
document.write('<embed src="'+MyData[i]+'" type="audio/x-midi" autostart="true" loop="true">');

JavaScriptがオフの場合の属性は、下から4行目のタグを普通に書き替えて下さい。

　 WEST MiRa > JavaScript > サンプル集(257種類) > 音楽 > 日付によって変わる曲 >

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

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