|
Webページで、BGMを流すには、普通
<EMBED SRC="****" WIDTH=150
HEIGHT=40 AUTOSTART=TRUE LOOP=TRUE>
のようなタグを書きます。でも、この方法には、次のような欠点があります。
- BGMが要らない人は、ページを表示するごとに、停止ボタンを押さなければならない。
- 好きじゃない曲でも変えられない。
そこで、
- 選曲ができる。
- 選曲やON/OFFの状態をページ毎に記憶しておき、再訪問の時は自動で設定される。
- デザインは、CSSファイルを編集することで変更できる。
を実現する、スクリプトを書きました。
|
| (1) |
説明なし、選曲なし、スタイルシートなし |
 |
| (2) |
説明なし、選曲あり、スタイルシートなし |
 |
| (3) |
説明あり、選曲なし |
 |
| (4) |
説明あり、時刻選曲 |
 |
| (5) |
説明あり、メニュー選曲 |
 |
| (6) |
説明なし、ランダム選曲、ボタンに画像を使用 |
 |
| (7) |
説明あり、選曲なし、ボタンに画像を使用、オプション指定 |
 |
| (8) |
説明あり、メニュー選曲、背景・ボタンに画像を使用、オプション指定 |
 |
| (9) |
説明あり、ランダム選曲 |
 |
| (1)「midiplayer.js」をダウンロードする
|
| (2))<HEAD>と</HEAD>の間に、次のようなスクリプトを挿入する
<SCRIPT Language="JavaScript"
SRC="midiplayer.js"></SCRIPT>
|
(3)<BODY>タブの後に、例えば、次のようなスクリプトを挿入する
<SCRIPT language="JavaScript">
<!--
midi = new Array();
note = new Array();
midi[0] = "h_green_o.mid";
note[0] = "♪グリーンスリーブス / イギリス民謡/ オルゴール版";
midiPlayerOne("mp_blue.css", midi, note);
//-->
</SCRIPT>
|
【固定曲】
決められた曲を演奏します。
midiPlayerOne(デザイン, ファイル名の配列,
説明文の配列) |
【ランダム選曲】
複数の曲からランダムに選曲します。
midiPlayerRandom(デザイン, ファイル名の配列,
曲数, 説明文の配列) |
【時刻選曲】
現在の時刻に応じて選曲します。例えば、曲数=4ならば、0〜5時、6〜11時、12〜17時、18〜23時で、曲が変わります。
midiPlayerOclock(デザイン, ファイル名の配列,
曲数, 説明文の配列) |
【メニュー選曲】
曲目メニューから選曲します。
midiPlayerSelect(デザイン, ファイル名の配列,
曲数, メニューの配列, 説明文の配列) |
※最後の引数の「説明文の配列」は省略可能です。
| 書式 |
内容 |
省略時 |
| MP_TEXT_PLAY = "xxx"; |
PLAYボタンに表示する文字列 |
演奏 |
| MP_TEXT_STOP = "xxx"; |
STOPボタンに表示する文字列 |
停止 |
| MP_TEXT_SELECT = "xxx"; |
SELECTボタンに表示する文字列 |
選択 |
| MP_AUTO_LOAD = xxx; |
自動演奏する:1 しない:0 |
1 |
| MP_MAQUEE_SPEED = xxx; |
マーキー表示の速度 動かさない:0 |
100 |
| ID |
内容 |
| PLAYER |
全体 |
| MIDIFORM |
フォームタグ |
| MIDITEXT |
曲説明の表示枠 |
| MIDISEL |
曲目選択枠 |
| PLAYBTN |
PLAYボタン or SELECTボタン |
| STOPBTN |
STOPボタン |
| 基本構造 |
<DIV id="PLAYER">
<FORM id="MIDIFORM">
<INPUT id="MIDITEXT"
type="text">
<SELECT id="MIDISEL">
<OPTION>
</SELECT>
<INPUT id="PLAYBTN"
type="button">
<INPUT id="STOPBTN"
type="button">
</FORM>
</DIV> |
音楽ファイルは、HALMIDI.com からダウンロードしました
|