中小企業の働き方改革をサポート>>

ホームページ製作中で、1分程度の動画を5つ見せたいです。
ボタンを5つ並べて、clickすると同一のページ内で指定された
動画ファイルを再生する方法は有るでしょうか?

そんな方法が無ければ、
<iframe src="movie.html" height=300 width=300></iframe>
のように、5つの動画を5つのページに埋め込んでiframeで
呼び出す!!って方法は可能ですか??
押されたボタンで呼び出される"movie.html"が変更出来る様な
方法がございましたら教えて頂きたいです。

宜しくお願いします。

このQ&Aに関連する最新のQ&A

A 回答 (1件)

とりあえずらしいものは作ったのですが、Firefoxだと表示が変になったりおかしいですね……



以下、動画ファイル「D:\gg1.wmv」などがあるものとします。
------------------------------
<html>
<head>
<title>動画再生セレクト</title>
</head>
<script type="text/javascript">
<!--
function movinit(movsel) {
thismov.innerHTML='<embed src=\"' + movsel + '\" width=\"640\" height=\"480\">'
}
//-->
</script>
<body>
<div id="thismov" width="700" height="540">
<embed src="D:\gg1.wmv" width="640" height="480">
</div>
<form id="movcont">
<div>
<input type="radio" name="movsel" onclick="movinit('D:\\gg1.wmv')" checked>動画A
<input type="radio" name="movsel" onclick="movinit('D:\\gg2.wmv')">動画B
<input type="radio" name="movsel" onclick="movinit('D:\\gg3.wmv')">動画C
<input type="radio" name="movsel" onclick="movinit('D:\\gg4.wmv')">動画D
<input type="radio" name="movsel" onclick="movinit('D:\\gg5.wmv')">動画F
</div>
</form>
</body>
</html>
------------------------------

最初OBJECT要素を使用してがんばって動画選択や再生ボタンなどを作ったのですが、IEとFirefoxではHTMLの記述構文が異なるため挫折しました。
正直embed要素やinnerHTMLメソッドを使うのは気が引けるのですが、ほとんどのブラウザで一応動くものとしてアップしました。
ブラウザの種類や画像形式などが限定されればもっと良いのができるのですが、IEだけで良いのでしたら以下のでもよいかと思います。

------------------------------
<html>
<head>
<title>動画再生セレクト</title>
</head>
<body>
<object id="thismov" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95">
<param name="FileName" value="D:\gg1.wmv">
<param name="AutoStart" value="true">
<param name="ShowControls" value="false">
</object>
<form id="movcont">
<div>
<input type="radio" name="f" onclick="thismov.FileName='D:\\gg1.wmv'" checked>動画A
<input type="radio" name="f" onclick="thismov.FileName='D:\\gg2.wmv'">動画B
<input type="radio" name="f" onclick="thismov.FileName='D:\\gg3.wmv'">動画C
<input type="radio" name="f" onclick="thismov.FileName='D:\\gg4.wmv'">動画D
<input type="radio" name="f" onclick="thismov.FileName='D:\\gg5.wmv'">動画E
</div>
<div>
<input type="button" value="再生" onclick="thismov.play()">
<input type="button" value="停止" onclick="thismov.stop(); thismov.CurrentPosition=0;">
<input type="button" value="一時停止" onclick="thismov.pause()">
</div>
</form>
</body>
</html>
------------------------------

やはり、柔軟な対応をするためにはFlashやJavaAppletほかHTML以外の技術が必要なのでしょうか。

参考になれば幸いです。
    • good
    • 0
この回答へのお礼

丁寧なレスありがとうございます。
教えて頂いた記述を参考にがんばって見ます。
ブラウザによって表示が違うって言うのが大変そぉですよね~
また結果報告させて頂きますねm(__)m

お礼日時:2007/11/27 15:36

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング