- ベストアンサー
画像ファイルと動画ファイルを切り替えて表示する方法
- ホームページ上で、画像ファイルと動画ファイルを切り替えて表示するためのソースコード例を教えてください。
- ボタンを押すことで画像ファイルと動画ファイルが切り替わるようにしたいです。
- 動画ファイルにはYouTubeのEMBEDソースを使用したいです。
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
すみません、見やすいように方法を変えます <head></head>の間に、 ---------------- <script> function showmovie() { document.getElementById("mm").style.display="none"; document.getElementById("movie").style.display="block"; } </script> ------------- を入れ、表示部分に -------------- <input type="button" value="movie" onclick="showmovie()"> <img src="image/info.jpg" alt="" name="mm" ID="mm"> <div id="movie" style="display:none"> <!--ここから下に動画表示のソース--> <object width="425" height="350"> <param name="movie" value="http://www.youtube.com/v/wRaCkqG_YRk"></param> <param name="wmode" value="transparent"></param> <embed src="http://www.youtube.com/v/wRaCkqG_YRk" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed> </object> <!--ここから上に動画表示のソース--> </div> ---------------- を入れてください。始めの読み込みに少し時間がかかりますが、もし支障があれば仰言ってください
その他の回答 (1)
- masaota56
- ベストアンサー率41% (58/139)
YouTubeのEmbedは良く知らないので恐縮ですが・・ ※ボタン部分のソース INPUT TYPE=BUTTON VALUE="movie" onclick="document.mm.innerHTML=EMBEDソース" ※表示部分のソース div id="mm" IMG SRC="image/info.jpg" ALT="" NAME="mm" /div
補足
いろいろ試したのですが勉強不足で うまくできません。 EMBEDソースは、↓から加工しています。 <object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/wRaCkqG_YRk"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/wRaCkqG_YRk" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object> ※ボタン部分のソース <INPUT TYPE=BUTTON VALUE="movie" onclick=="document.mm.innerHTML=<embed src="http://www.youtube.com/v/wRaCkqG_YRk" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed> ※表示部分のソース <IMG SRC="image/info.jpg" ALT="" NAME="mm" ID="mm"> まで修正しました。 問題があるところを教えていただければ幸甚です。
お礼
御礼が大変遅くなって申し訳ございません。 ばっちり稼動しています。 ありがとうございました。