ムービーを再生する

手動で再生する


<video controls loop width="960" class="text-center">
	<source src="/path/to/movies/1_video.mp4" type="video/mp4">
	<p>※動画が表示されない際のメッセージ Download the<a href="/path/to/movies/0_video.mp4">MP4</a>video.</p>
</video>

複数のムービーを選択して再生する


再生する動画を選択


<video controls id="movie" src="/assets/movies/0_video.mp4" autoplay muted width="960" height="504"></video>
<hr>
<h3>再生する動画を選択</h3>
<div class="flex flex-center">
	<p class="margin05"><button onclick="playVideo(1)">1 : Aパート ライト 5秒</button></p>
	<p class="margin05"><button onclick="playVideo(2)">2 : Bパート リーフ 26秒</button></p>
	<p class="margin05"><button onclick="playVideo(3)">3 : Cパート スカイ 9秒</button></p>
	<p class="margin05"><button onclick="playVideo(4)">4 : Dパート ミルキーウェイ 12秒</button></p>
</div>

function playVideo(num) {
	console.log(num);
	tag = document.getElementById("movie");
	switch (num) {
		case 1:
			tag.src = "/path/to/movies/1_video.mp4";
			break;
		case 2:
			tag.src = "/path/to/movies/2_video.mp4";
			break;
		case 3:
			tag.src = "/path/to/movies/3_video.mp4";
			break;
		case 4:
			tag.src = "/path/to/movies/4_video.mp4";
			break;
	}
}

TOP