본문 바로가기

Spring

html5 video 태그 여러 개의 비디오를 연속 재생하기

HTML 

 

JAVASCRIPT(JQUERY)

$(function(){ 
    	$("#video1").bind("ended", function() {
 		document.getElementById("video2").play();
 	});
	$("#video2").bind("ended", function() {
        	document.getElementById("video3").play();
        });
	$("#video3").bind("ended", function() {
 		document.getElementById("video1").play();
 	});
}); 

비디오를 3개의 연속으로 재생해야될 일이 있었는데요.. 

 

video 태그에다가 onended="ended(1)"

이런식으로 옵션을 거니까 안먹혀서 구글링 해서 찾음..

 

제이쿼리에서 이렇게 해주니까 됩디다..  (참고한 사이트 주소  https://stackoverflow.com/questions/8153703/html5-video-ended-event-not-working-in-chrome-and-ie )

 

그리고 video 태그에 muted 를 없애면 autoplay가 안되더라고요?? 

제생각에는.. 사운드 달아서 오토재생시키면 사용자가 놀랄수도있으니까능 그거 방지로다가 브라우저나 이런데서 막은듯..? 왠지느낌상ㅋ

 

글고 video 파일 자체를 서버에다 올려놓고 그걸 video태그로 트는건데 

이렇게하니까 트래픽? 이 엄청 발생함.. 비디오파일 용량만큼 발생해버림ㄷㄷ