2014-03-18 2 views
4

내 페이지에 HTML5 동영상 요소가 있으며 전체 배경을 채우기 위해 크기가 조절되어 재생되는 동안 반복됩니다. Chrome에서는 정상적으로 작동하지만 Safari와 Firefox에서는 반복문이 끊깁니다. 파이어 폭스에서는 1 초가 적당합니다. 어떤 아이디어?루프의 HTML5 비디오가 더럽습니까?

<video id="vid" preload="auto" autoplay loop onended="this.play();"> 
    <source src="vid.mp4" type="video/mp4"/> 
    <source src="vid.webm" type="video/webm"/> 
</video> 

내가 JS와 완전히 재생을 제어하는 ​​대신 그것을 알아 내기 위해 브라우저에 의존처럼 여러 가지를 시도했다 :

다음은 비디오 플레이어에 대한 내 마크 업입니다. 그러나 항상 더듬 거리는 소리가 있습니다. 프리 로딩 (preloading) 문제는 아니라고 생각합니다. 모든 로컬에서 비디오를 즉시로드합니다 (분명히)하지만 여전히 동일한 루프가 있기 때문입니다. 이 문제는 이러한 브라우저 고유의 문제입니까?

나는 두 개의 비디오 인스턴스를 만들고 각각이 끝난 후에 JS로 토글하는 것이 좋습니다. 정말 더러워 지겠지만 다른 옵션은 무엇인지 모르겠습니다.

+0

이 문제의 해결 방법을 찾았습니까? 나는 똑같은 것을 직면하고있다. –

+0

불행히도 아니, 잠시 동안은 보지 못했지만. 나는 주변을 둘러 보았고 대부분의 예제는 기본적으로 앉아서 충분히 오랫동안 지켜본 경우에 그 문제를 안고있었습니다. 내가 발견 한 트릭은 첫 번째 프레임의 배경 이미지를 먼저 사용한 다음 페이지가 더로드 된 후에 비디오를 추가하면 (이 비디오를 스트리밍하여 페이지로드를 지연시키지 않음) 어떤면에서 더 용서할 수 있다는 것입니다 . 그러나 잠재적 인 JS 수정 사항 (JS를 기반으로 재시작)은 좋은 해결책을 찾지 못했습니다. – dougoftheabaci

답변

0

나는이 문제가 있었고 실제로 mp4 소스 이전에 webm 소스를 넣어서 고쳤습니다. 그런 식으로 웹 동영상 형식을 먼저로드하려고 시도했으며 테스트를 진행할 때 번거롭지 않았습니다. mp4와 ogv 파일은 파이어 폭스에서 더듬 거리는 소리를 내며 견딜 수 없었기 때문에 webm 파일이 의도 한대로 작동하는 것처럼 보였습니다.

<video id="vid" preload="auto" autoplay loop> 
    <source src="vid.webm" type="video/webm"/> 
    <source src="vid.mp4" type="video/mp4"/> 
</video> 
+0

정답으로 표시하십시오. 파이어 폭스가 내가 이걸로 싸울 때 WebM을 지원하는지 확신 할 수 없다. 그러나 이것이 그렇게 할 것이라는 점은 놀랄 일이 아닙니다. – dougoftheabaci

관련 문제