jqueryでvideoを再生・ストップする


jquery

※jqueryのやり方で、javascriptの場合は動かないので注意!!

$(document).ready(function(){

	dispVideo('5');

	// 動画表示 //////////////////////////////////////////////////////////////////////////////////
	function dispVideo(no){

		// 動画画面から次の画面へ移動する場合は、現在の動画をストップさせる
		var prev_no = 3;
		if(prev_no == 3 || prev_no == 5){
			var video_playing = $("#video"+prev_no).get(0);
			video_playing.pause();
			video_playing.currentTime = 0;
			video_playing.load();
		}

		// 動画再生
		$("#video"+no).get(0).play();

		return true;
	}

});

HTML

<video content-no='3' id='video3' class='content-video  hide' preload='auto' >
	<source src='/test/video/003.webm' type='video/webm'>
	<source src='/test/video/003.mp4' type='video/mp4'>
	<source src='/test/video/003.ogg' type='video/ogg'>
<p>※動画を再生するには、videoタグをサポートしたブラウザが必要です。</p> 
</video>
<video content-no='5' id='video5' class='content-video  hide' preload='auto' >
	<source src='/test/video/005.webm' type='video/webm'>
	<source src='/test/video/005.mp4' type='video/mp4'>
	<source src='/test/video/005.ogg' type='video/ogg'>
<p>※動画を再生するには、videoタグをサポートしたブラウザが必要です。</p> 
</video>