2010-06-12 9 views
2

웹 페이지에서 비디오를 재생하려면 비디오 플레이어를 추가해야합니다. 일반적으로 swfobject 라이브러리의 도움으로 Flash 플레이어를 사용합니다. 플래시 플레이어와 자바 스크립트가 모두 활성화되어 있으면 작동합니다.플래시 비디오 플레이어 VS HTML 5 비디오

현재 XHTML 1.0 엄격한 Doctype을 사용하고 있습니다.

제 질문은 내 doctype을 HTML 5 doctype으로 변경하고 HTML 5 비디오를 사용하여 비디오 플레이어를 추가 할 수 있습니다. HTML5를 지원하지 않는 브라우저에서 자바 스크립트를 사용할 수 있습니다.

지원되는 브라우저에서 비디오는 Flash Player 및 javascript없이 작동하며 지원되지 않는 브라우저에서는 js 지원과 함께 작동합니다.

이것이 가능합니까? 이것은 좋은 생각입니까?

+0

자바 스크립트를 통해 사용 도구를 감지하고 필요할 때 비디오 태그를 삽입하거나 그 반대로 이동해야합니다. – phwd

답변

2

"HTML5"(HTML5 사용시, 지금까지 주요 브라우저 공급 업체의 구현을 정리하고 있음)에는 <video>에 대해 합의 된 코덱이 아직 없으므로 다양한 브라우저가 서로 다른 코덱을 사용합니다. 일부 소유권, 일부 소유권이 아닙니다. HTML5 doctype을 사용할 수 있으며 지금은 <video>을 사용할 수 있지만 위의 경우가 아니면 Safari의 경우 H.264 코덱, Firefox의 경우 Ogg/Theora 및 Flash가 필요합니다. 아, 그리고 ... 뭔가 같은

... 이미지를 사용할 수 있으며, 경우에 사용자에게 손으로 쓴 편지 경우 플래시가 설치되지 않은 경우 이미지를 잊지 텍스트하지 않는

<!DOCTYPE html> 
... 
<video> 
    <source src='your_movie.ogv' /> 
    <source src='your_movie.m4v' /> 
</video> 

다른 뉴스에서 나는 Safari and Quicktime are not Standards이라는 JW의 블로그에서이 게시물을 즐겼습니다.

+0

youtube, vimeo 등 HTML 5 플레이어를 사용하는 방법은 무엇입니까? –

+0

Opera와 Firefox의 H.264 지원 및 실험용 빌드 : http://www.youtube.com/html5 – typeoneerror

+0

iOS 기기에서 YouTube를 볼 때 자동으로 변경되는 것을 의미합니까? 완성을 위해 – phwd

2

먼저, 이미 만나지 않았다면 http://camendesign.com/code/video_for_everybody 을보고 싶을 것입니다. 어쨌든

, 사용자 정의 플래시 대안 제공하려는 경우이 작동합니다 : 분명히

<video width="..." height="..." controls="controls" preload="none"> 
    <source src="video/demo.mp4" type="video/mp4" /> 
    <source src="video/demo.webm" type="video/webm" /> 
    <source src="video/demo.ogv" type="video/ogg" /> 
    <span id="flashAlternative">what, no flash+no html5? crazy!</span> 
</video> 
<script> 
    swfobject.embedSWF(..., "flashAlternative", ...); 
</script> 

당신이/... 대안으로 비디오 방금 소스 코드를 배치 유튜브/비 메오를 사용하려는 경우, 대신 스크립트 태그의 : 당신은 대역폭의 부하를 지불하지 않으려는 경우

이 솔루션의
<video width="..." height="..." controls="controls" preload="none"> 
    <source src="video/demo.mp4" type="video/mp4" /> 
    <source src="video/demo.webm" type="video/webm" /> 
    <source src="video/demo.ogv" type="video/ogg" /> 
    <!-- embedding code here --> 
</video> 

모두가 플래시 비디오를 통해 HTML5 비디오를 선호하는 당신은 모든 사람들에게 유튜브 비디오를 표시하는 것을 선호 할 수있는 플래시가 있고, html5로만 대체 할 수 있습니다. 쓸모 없어. 즉,이 다음과 같을 것이다 :

<object type="application/x-shockwave-flash" width="..." height="..." data="..."> 
    <param name="movie" value="..." /> 
    <video width="..." height="..."> 
     <source src="..." type="video/mp4" /> 
     <source src="..." type="video/webm" /> 
     <source src="..." type="video/ogg" /> 
     <!-- here comes the alternative for people who have neither flash, nor html5 --> 
    </video> 
</object> 

방금 ​​내 유튜브/비디오 및 smush의 HTML5 비디오에서 소스 코드를 복사 할 수 없습니다 통지하십시오, 당신은 위의 모양 때문에 (데이터를 수정해야하고 movie 속성은 swf 파일의 소스를 지정하며 embed 태그는 필요하지 않습니다!).

+0

: 두 번째 예제와 세 번째 예제 만 테스트 했으므로 swfobject 예제를 약간 수정하여 작동시켜야하지만 아이디어를 얻으실 수 있습니다! – kritzikratzi

관련 문제