- ベストアンサー
MIDIコンテンツのための小窓を作成する方法
- 自分のホームページでMIDIのコンテンツを作成する際、小窓を使用してユーザーが曲を試聴できるようにする方法について知りたいです。
- 通常、小窓を出すためには別のHTMLファイルを用意する必要がありますが、変数や他の方法を使用して、ユーザーが試聴ボタンをクリックするだけで小窓の題名とMIDIが入れ替わる方法を知りたいです。
- 画像のクリックで小窓を表示し、曲名ごとに試聴できるMIDIを再生する方法について、具体的な作り方や参考サイトを教えていただけると助かります。
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
> http://www.oitaweb.ne.jp/hp/tatsuya/java/bgm3.htm > で、コンボボックスではなくて、ボタンで・・・と考えていました。 なるほど、ウィンドウを開く方から document.write() する、って手もある んですね。 ってことは、ラジオボタン(で良い?)から myGo() を呼び出せば良いだけね。 それなら、もっと簡単。 まずは、<form> のところを以下のような感じに。 <form name="myForm"> ☆☆ お好きな曲を選んでください ☆☆ <br> <input type=radio name=myMenu value=0 onClick="myGo(this)">日曜画家<br> <input type=radio name=myMenu value=1 onClick="myGo(this)">渚のヒロイン </form> それから、関数 myGo() の先頭あたりを以下のような感じに。 function myGo(btn){ mySelect = btn.value; myWin = window.open("" , "bgmwin","width=210,height=160"); // ここは、変わってません いかが?
その他の回答 (1)
- a-kuma
- ベストアンサー率50% (1122/2211)
CGI を起動するときに get で渡すパラメータって、実は HTML でも指定でき、 Javascript で利用することができます。 それを利用して、曲名と URL を渡す例を、簡単に作ってみました。 この例では、小窓で <a> タグで表示していますが、パラメータさえ渡せれば MIDI を鳴らすことはできるのですよね? ■曲名一覧が有る html <html> <body> <script type="text/JavaScript"> function open_win(title, url) { // 題名は漢字が入るかもしれないから escape しておく u = "sound.htm" + "?title=" + escape(title) + "&url=" + url; window.open(u, "a", "height=100,width=100"); } </script> <form name="X"> <input type=button value=" 曲A " onClick="open_win('曲A', 'a.htm')"> <input type=button value=" 曲B " onClick="open_win('曲B', 'b.htm')"> </form> </body> </html> ■渡されたパラメータを使う html (sound.htm) <html> <script type="text/JavaScript"> // パラメータをばらして、title と url の内容を設定する var title; var url; p = location.search; // これがパラメータ(?以降)を表す v = p.substring(1).split("&"); // 一文字目の?の後を、&で分割する t = v[0].split("="); // ひとつめは title=??? のはず title = unescape(t[1]); // 題名は漢字が入るかもしれない… t = v[1].split("="); // ふたつめは url=??? のはず url = t[1]; </script> <head> <script type="text/JavaScript"> document.write("<title>" + title + "</title>"); </script> </head> <body> <script type="text/JavaScript"> document.write("<a href=\"" + url + "\">"); document.write(title); </script> </a> </body> </html> エラーチェックなんかもばっさり削ってますが、参考になりますか?
補足
お早い回答ありがとうございます。 わざわざ作っていただいて、嬉しいです。 しかし、悲しいことにJavascript幼稚園児の私には、a-kumaさんの回答が漠然としか分かっておりません(;_;)なんとなぁく、分かるという感じでしょうか。 私が考えていたのは http://www.oitaweb.ne.jp/hp/tatsuya/java/bgm3.htm で、コンボボックスではなくて、ボタンで・・・と考えていました。 もう少し、じっくり見せていただいて、勉強します。
お礼
できました!! 1ヶ月近く、悶々と考えていたことが解決できて、すっきりしました。 本当にありがとうございます。とても嬉しいです。 余談ですが・・a-kumaさんて、ものすごく回答されてますねぇ・・履歴見せていただいて、感心しちゃいました。