画像を押すことで音楽を鳴らす方法をご教示ください

このQ&Aのポイント
  • 画像をクリックして音楽を再生する方法を知りたいです。現在、<EMBED>タグを使用した通常のボタンではなく、自分が用意した画像をクリックすると音楽が再生されるようにしたいですが、実行するとWindows Media Playerで再生されてしまいます。Windows Media Playerの表示なしで音楽を流す方法はありますか?
  • HTMLコード上で、画像をクリックすることで音楽が再生される方法を教えてください。通常のボタンではなく、自分の用意した画像をクリックしたときに音楽が鳴るようにしたいです。ただし、実行するとWindows Media Playerが表示されてしまいます。Windows Media Playerを表示せずに音楽を再生する方法はありますか?
  • 自分が用意した画像をクリックすると音楽が再生されるHTMLコードの作成方法が知りたいです。通常のボタンではなく、画像をクリックすると音楽が流れるようにしたいのですが、実行するとWindows Media Playerで再生されてしまいます。Windows Media Playerの表示なしで音楽を再生する方法を教えてください。
回答を見る
  • ベストアンサー

画像を押すことによって音楽を鳴らしたいのですが・・・

<EMBED>タグで普通に表示されるボタンではなく、 自分の用意した画像(ボタンの画像など)を クリックしてもらうことで、音楽が流れるようにしたいのですが、 そこで、色々調べ下のようなソースをつくりました。 が、これを実行すると、Windows Media Player での再生になってしまいます。 Windows Media Playerの表示なしに ただ、音楽を流したいのですが、どのように したら良いのでしょうか? <HTML> <HEAD> <TITLE>タイトル名</TITLE> </HEAD> <BODY> <A HREF="○○○○.mid "> <img src=○○○.gif border=0></A> 本文 </BODY> </HTML>

  • HTML
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
回答No.2

もうひとつの方法として,参考URLを開き,「<BGM ON!>」をクリックしてください。 ここでは,音楽入りのヘッドライン(1番上のスクロールしない部分)と音楽無しヘッドラインを使っています。 「<BGM ON!>」で音楽を流すことは出来るのですが,止めることは出来ないようになってます。 でも,ストップボタンを用意し,音楽無しヘッドライン(フレームページ内のひとつのページなんですが・・・)にリンクさせることで,音楽を止めることが出来そうです。 それと,nami50さんがやりたかった方法で音楽を流しているホームページがあります。 それが2番目の参考URLのところです。 ページが表示されましたら,「タイトル画面を選んでください」から「綺麗」「軽量」どちらを選んでもコンテンツの内容に代わりが無いので,どちらかをクリックしてください。 クリックしてでてきたページの中の「SELECTION」と言う文字をクリックします。たぶん,下へとスクロールしないと出てこないと思いますが・・・。 で,新たに表示されたページがnami50さんがやりたかった方法をとっています。 フレームページを使っていますので,フレームの右側で右クリック>「ソースの表示」をクリックするとソースが出てきます。 これを一度ハードディスクに保存して,あとでゆっくりと「研究」してください。 私も研究してみます。 何か,コツがあるはずだと思いますよ。 がんばりましょう!

参考URL:
http://www.din.or.jp/~alger/index2.html,http://www2.justnet.ne.jp/%7Eealia/
nami50
質問者

お礼

いろいろありがとうございました。 ソースを持ってきたので、 これからゆっくり研究してみようと思います。 ありがとうございました。

その他の回答 (1)

回答No.1

探してきました。 <a href="○○.htm" target="musicbox"><img src=○○○.gif border=0></a> 別に音楽を鳴らすだけのページを作製し,上記のタグを入れることで再生可能のようです。 <html> <head> </head> <body> <EMBED src="○○.mid" width="144" height="15" loop="true" autostart="true" align="top"> <noembed> <bgsound src="○○.mid"loop=1> </noembed> </body> </html> 停止の場合は, <html> <head> </head> </html> とだけ入力されたページへリンクさせます。 <a href="××.htm" target="musicbox"><img src=×××.gif border=0></a> ・・・こう言う手を使っていたんですねぇ・・・。 なお,タグ等は一部変更していますが,そのページのソースをそのまま使っています。 また,確認はIE 5.0/5.5/6で出来ています。 <bgsound>タグは確か,IEだけだったかもしれないですけどね。 Netscapeでもと言う場合は,<EMBED>タグで試してみてください。

nami50
質問者

お礼

gakusyanekoさん、探してきてくださって本当にありがとうございました。 そのまま使ってみたら、なぜか表示されてしまったので(バグなのでしょうか?) ちょっと改良して、 演奏するページを下のようにつくり、test3.htmとし、 ++++++++++++++++++++++++++++++++++++ <html> <head> </head> <body> <embed src="○○.mid" type="audio/midi" autostart="true" loop="false" width="144" height="44" hidden="true"> </body> </html> +++++++++++++++++++++++++++++++++++++ それをこの下に埋めて ===================================== <HTML> <HEAD> <TITLE>タイトル名</TITLE> </HEAD> <BODY> <A HREF="test3.htm" target="musicbox"><img src="××.gif" border=0 height=80 width=50></A> 本文 </BODY> </HTML> ===================================== 作りました。 そのようにしたら、新しいウインドウが開き音楽スタートになりました。 私が考えていたのは、media playerも出ず、新しいウインドウも開くことなく音楽が再生させることだったのですが、この、ウインドウが開くものと、フレームをうまく組み合わせると、私のイメージに近いものができそうでした。 今改めて、MIDIを置いてあるページを回ってみましたが、 やはり大多数どこも別のhtmをつくり、ウインドウを開く方法でした。 私の当初の考えはむちゃくちゃだったのかもしれません。 お手数おかけしました。 本当にありがとうございました。 これからもいろいろ勉強したいと思います。

関連するQ&A

  • 画像をクリックして別の画像を変えたい

    ボタン画像をクリックしたときに同一ページ内にある画像が変わるようにしたいのですが、下のように描くと、ボタン画像(button.gif)自身が2.pngなどの画像に変わってしまいます。   <HTML> <HEAD> <TITLE>スワップイメージ</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function changeImage(imageUrl){ document.images[0].src = imageUrl; } // --> </SCRIPT> </HEAD> <BODY> <A HREF="#" onClick="changeImage('1.png')" ><IMG SRC="button.gif" border="0"></A> <A HREF="#" onClick="changeImage(2.png')" ><IMG SRC="button.gif" border="0"></A> <A HREF="#" onClick="changeImage(3.png')" ><IMG SRC="button.gif" border="0"></A> <TABLE BORDER="0"> <TR> <TD>ボタンを押すと下に画像が表示されます。</TD> </TR> <TR> <TD><IMG SRC="1.png"></TD> </TR> </TABLE> </BODY> </HTML> 原因を私なりに考えたところ、設定した変数mageUrlをボタンを表示させるために使った<img src="button.gif">で受け取ってしまっているというのはわかりました。(確認のため <IMG SRC="1.png"> を<A HREF>~</A>より上に持ってきたら思っていた動きになりました。)  けれどそれからどう修正したらもとの順番でもちゃんと動くのかがわかりません。過去ログの似た質問も拝見したのですが、今の自分では理解できませんでした‥。すみませんがよろしくお願いいたします。

  • HPに音楽を取り入れる方法を教えて下さい。

    おちゃのこネット加入でホームページを作っております。 ビルダーを使って作成しております。 ビルダー内プレビューでは音楽を聞くことができます。 そのまま、ビルダーのHTMLコピーして、おちゃのこの方へ貼り付けしてますが、音楽が流れません。どうしてでしょうか。 ビルダーのhtmlです。 どの部分を直せば私のhpで聞けますか。 一回再生でなく連続で流したいです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META name="GENERATOR" content="IBM HomePage Builder 2001 V5.0.3 for Windows"> <TITLE></TITLE> </HEAD> <BODY><EMBED src="file:///C:/Program Files/IBM HomePage Builder 2001/sample/sound/baby.mid" autostart="true" hidden="true" loop="true"></BODY> </HTML> <bgsound src="baby.mid" loop="infinite"> パソコン環境に問題もありますか。 xpです。 宜しくお願いします。

  • Windows Media PlayerでHPのMIDIを再生したいのですが

    いつもお世話になっております。 最近、バッハの『G線上のアリア』に感動しております。そのため、連続で再生して聴ける様に、HTMLタグを作成し、リンクを貼ろうとかんがえているのですが、embedタグでは、自動的にQUICKTimeで再生されてしまいます。 個人の好みで恐縮ですが、私は音楽再生はWindows Media Playerが一番好きです。 重低音の迫力が全然違いますので、自動的にWindows Media Playerで再生できるように設定したいのですが、できますでしょうか? HTMLタグの設定方法を教えてくださいますようお願いいたします。 ファイルの拡張子は「.mid」です。

    • ベストアンサー
    • HTML
  • HTMLでHP制作、画像の横にアンダーバーが出てしまいます

    現在HTMLを使ってHPを制作中です。 HTMLは初心者で、ウェブや本を参考して作っています。 そこで問題が発生しました。回答よろしくお願いします。 以下のHTMLタグを入れたところ(○○以外はコピペしました)、 <HTML> <HEAD> <TITLE>○○○</TITLE> </HEAD> <BODY BGCOLOR="#FFFFFF" TEXT="#000000" LEFTMARGIN="0" RIGHTMARGIN="0" TOPMARGIN="20" BOTTOMMARGIN="0" BACKGROUND="○○.gif"> <DIV ALIGN="CENTER"> <IMG SRC="○○.gif"> <A HREF="○○.htm"><IMG SRC="○○.gif" BORDER="0"> <A HREF="○○.htm"><IMG SRC="○○.gif" BORDER="0"> <A HREF="○○.htm"><IMG SRC="○○.gif" BORDER="0"></A> <IMG SRC="○○.jpg" WIDTH="200" HEIGHT="159"> </DIV> </BODY> </HTML> htmで確認したところ、 2と3個目のIMGの横(右下)に小さなアンダーバーのようなものが表示されてしまいます。 これを表示しないようにしたいのですが、調べても解決しませんでした。 初心者なもので、質問する内容に情報が足りなかったら教えて下さい。 回答、よろしくお願いします!

    • ベストアンサー
    • HTML
  • HPで音楽を流したいのですが、、、

    自分のPCで(Media Player)、音楽を聞けるのですが、自分のHPに以下のように入力しましたが、音楽が出ません。 <EMBED SRC="izumi.mid" WIDTH=100 HEIGHT=30 AUTOSTART=TRUE LOOP=TRUE> <BGSOUND SRC="izumi.mid,wav" LOOP=INFINITE> 当方、Win98・マイクロソフトInternet Explorerです。 どこが不備でしょうか?また、設定に不備があるのでしょうか? よろしく、ご教授お願いします。

  • 動画のソース記述について

    HTMLの本を片手に電子アルバムを作成中です。 Windows98でIEを使用しています。 公開する予定はないので、サーバーにはアップせず、 独りで楽しむだけです。 その中に人からもらったavi形式の動画があるのですが、 ホームページ上で音、画像とも表示できません。 通常、aviの表示にQuicktime5を使っています。 問題の動画もQuicktime5ではきちんと表示されました。 ソースは以下のとおりです。 間違いを直して下さい。よろしくお願いします。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BACKGROUND="../s64_51.gif"> <TABLE BORDER="0" WIDTH="100%" HEIGHT="100%"> <TR><TD VALIGN="middle" ALIGN="center"> <EMBED SRC="m01.avi" WIDTH="320" HEIGHT="260" ALIGN="BOTTOM" CONTROLLER="TRUE" LOOP="FALSE" AUTOPLAY="TRUE"> </TD></TR> </TABLE> </BODY> </HTML>

  • HP。画像の貼り付けができません。

    HTML記述でホームページを作っています。 画像の貼り付けをしたいのですが、できません。 <html> <head><title>タイトル</title></head> <body background="ファイル名"> 本文 </body> </html> でできると思ったのですが・・・ 画像ファイルはHTMLを書いているメモ帳があるのと、同じフォルダ内にしています。JPEG、GIF、BMPと試してみましたがどれもダメでした。 ネット上からとってきた(フリー)からかな?と思い、自分で作ってみたのですが、それも載りませでした。

  • 新ウィンドウの画像をクリックして閉じる

    画像を載せたホームページを作成しています。 target="_blank"で新ウィンドウで開いた画像をクリックして、新ウィンドウを閉じるにはどうしたら良いのでしょうか? これじゃダメなんでしょうか? <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <SCRIPT LANGUAGE="JavaScript"> <!-- function WinCls(){ window.close() } //--> </SCRIPT> <TITLE></TITLE> </HEAD> <BODY> <A href="aaa.jpg" javascript:WinCls()" target="_blank"><IMG src="aaa.jpg"></A> </BODY> </HTML>

  • 音楽CDを流す!

    再生ボタンを押すとCDから音楽が流れるようにしたいのでどうやってファイルを保存したらいいのか知りたいです。あと、midという拡張子になる方法が知りたい。タグなんだけど<EMBED SRC="***.mid" ここの部分がCDをパソコンで保存をすると最後が*****wmaになるんです。midというファイルにどうしてもならない。だから流れないんでしょうか。詳しく教えてください!

  • THML文書で作成したが行き詰まっています

    以下のように、ページを作成したのですが、 ■■.mid(MIDI)を、複数のMIDIファイル「■○.mid」□○.mid」「□●.mid」などのいくつかの音をランダムで流したいと思い、 色々調べて実行しましたが、うまくいきません。 詳しい方ご教授ください。 ++++++++++++++++++++++++ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META name="GENERATOR" content="IBM HomePage Builder 2001 V5.0.4 for Windows"> <TITLE>●●</TITLE> <LINK rel="SHORTCUT ICON" href="favicon.ico"> </HEAD> <BODY background="●.gif"> <CENTER> <TABLE width="594" border="1"> <TBODY> <TR> <TD width="229"><EMBED src="■■.mid" width="40" height="30" panel="0" autostart="true" loop="true"><font color=#FF8888 style='font-size:0.5em'>SOUND OFF</font><BR>●●</TD> <TD height="26" align="center" width="106"><A href="mailto:●●●?Subject=ホームページから送信"><IMG src="●.gif" width="57" height="80" border="0" alt="●●"></A></TD> <TD nowrap height="26" align="left" width="215"><BR>        <FONT color="#0000a0" size="-2">●●●<BR>         2002.●.●<BR> </FONT></TD> </TR> </TBODY> </TABLE> </CENTER> </BODY> </HTML>

    • ベストアンサー
    • HTML

専門家に質問してみよう