アプリ版:「スタンプのみでお礼する」機能のリリースについて

高校の文化祭へ向けて、ホームページでのミニゲームを製作しています。
しかしプログラム言語については浅学で、思うように製作できず、また考えているものを検索で見つけることもできていません。
他力本願であることは承知の上、ご協力をお願いします。

「HTMLで作ったページにあるボタンを押すと、動画が自動的に流れる」というものを作りたいです。
内容はじゃんけんのグーチョキパーを選ぶ、すると勝ち負けあいこの演出が動画で流れる……といったものです。
youtubeへ移動することを試したのですが、その場合わざわざyoutubeページへ飛んでしまうこと、そして再生ボタンを押さないと再生されないことが問題でした。
どうしても不可能なようならgifアニメにして流す、という方法も考えています。

手取り足取りの回答でなく、参考になるURLですとか、キーワードでも構いません。
どうか、回答をよろしくお願いいたします。

質問者からの補足コメント

  • どう思う?

    解決しますた。

      補足日時:2019/07/19 12:37

A 回答 (1件)

押したボタンに応じて動画ファイルを読込み再生させる例



<div>
<input type="button" value="再生A" onclick="play(0)">
<input type="button" value="再生B" onclick="play(1)">
<input type="button" value="再生C" onclick="play(2)">
</div>

<video id="v">
<source id="s" src="" type="video/mp4">
</video>

<script>
var movie_files = ['movie1.mp4','movie2.mp4','movie3.mp4'];
var video = document.getElementById('v');
function play(n) {
n = ~~n;
if(n < 0) n = 0;
else if(n > 2) n = 2;
document.getElementById('s').src= './' + movie_files[n];
video.load();
video.play();
}
</script>
    • good
    • 0

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