ウインドウを開く


新しいウインドウを開き、そこにメニューを表示させたりプレーヤーを表示させて 音楽を演奏させたりしたい。でも、通常のタグで開くと大きさや位置や表示項目を設定できない。 こんな時にはwindow.openを使うとカッコよくウインドウを開くことが出来る。

Example Fileのダウンロード


(1)自動的にウィンドウを開いて音楽を演奏させる。

1)新しく開いたウインドウにロードしてMIDIを自動演奏させるHTMLファイルを準備する。

2)<BODY>と</BODY>の間の適当な位置に次のJavascriptを入れる。

<SCRIPT language="JavaScript">
<!---
 window.open("torini.html","midi","width=310,height=120,resizable=1,scrollbars=0,toolbar=0,
menubar=0,location=0,directories=0,status=0,left=10,top=10,screenX=10,screenY=10");
//--->
</SCRIPT>

注意:windows.open(・・・・・・・・)の部分は1行に書いて下さい。

説明:
torini.htmlの部分にはMIDIを自動演奏させるファイルへのURLを入れます。
次のmidiは新しく開くウインドウの名前です。すでにmidiという名前のウインドウが 開いている場合には、新しいウインドウは開かないでそのウインドウにファイルをロードします。
widthとheightでウインドウの縦と横の大きさをピクセル数で設定します。
resizableを1(又はyes)にするとウインドウのサイズを変えられるようになり、0(又はno)にすると固定になります。
scrollbars,toolbar,menubar,location,directories,statusの値を0(又はno)にするとそれぞれのバーが 表示されなくなり、1(又はyes)にすると表示されるようになります。
left及びtopでウインドウの開く位置をピクセル数で指定します。screenX及びscreenYもウインドウの開く位置を指定します。 left及びtopはIE用のオプションで、screenX及びscreenYはNN用のオプションです。



(2)リンクをクリックするとウインドウが開いて音楽の演奏が始まる。

1)新しく開いたウインドウにロードしてMIDIを自動演奏させるHTMLファイルを準備する。

2)<HEAD>と</HEAD>の間の適当な位置に次のJavascriptを入れる。

<SCRIPT language="JavaScript">
<!---
var x;
function MStart(x)
{
 window.open(x,"midi","width=310,height=120,resizable=1,scrollbars=0,toolbar=0,
menubar=0,location=0,directories=0,status=0,left=10,top=10,screenX=10,screenY=10");
}
//--->
</SCRIPT>

注意:windows.open(・・・・・・・・)の部分は1行に書いて下さい。

このJavascriptによって変数xを定義し、関数MStart(x)を定義する。変数名及び関数名は何でもかまいません。

3)<BODY>と</BODY>の間にMStart(x)を呼び出すためのリンクタグを入れる。

<A HREF="JavaScript:MStart('torini.html')">鳥に乗って</A>

MStart(x)のxの部分にMIDIを自動演奏させるためのファイルへのURLを入れる。
これで、「鳥に乗って」のリンクをクリックすると、midiという名前のウインドウが開き、 xの部分で指定したファイルがロードされて音楽の演奏が始まる。midiというウインドウが すでにある場合はそのウインドウに指定したファイルがロードされる。
また、音楽演奏用のファイルを複数作り、xのURLをそれぞれのファイルにしたリンクタグを ファイルの数だけ作っておけば、どのリンクをクリックするかによって演奏させる曲を 選択することが出来る。

この方法を用いると、こんな風↓に動作します。

鳥に乗って   笑顔




HOUSE

2002.6.30 Shotaro