2012-09-08 2 views
0

웹 사이트 onload에서 애프터 이펙트의 애니메이션을 표시하는 가장 좋은 방법은 무엇입니까?로드맵으로 웹 사이트에 .mov를 표시하는 가장 좋은 방법

모든 주요 브라우저 및 iOS 기기에서로드 스크린처럼 재생해야합니다.

이것을 표시하는 가장 좋은 방법은 무엇입니까?

html5를 시도했는데 자동 재생이 iPad에서 작동하지 않았습니다. 나는 플래시를 사용하고 싶지 않다. 애니메이션은 자바 스크립트에 비해 너무 복잡합니다. 고품질의 애니메이션 GIF를 만드는 것이 가치가 있습니까?

+0

중요한로드가 필요한로드 스크린 자체가 좋은 사용자 환경을 조성하지 못합니다. 사용자는 최대한 빨리 콘텐츠에 액세스하려고합니다. – Mark

답변

4

사실 모든 onload 비디오의 주요 문제는 특히 모바일 장치에서로드 및 버퍼 시간이 될 것입니다. 스플래시 화면을로드하는 데 30 분이 걸릴 경우 경험은 매우 미미하며 실제 로딩 타임을 줄이기 위해 실제로 할 수있는 일은 거의 없습니다. 비디오를 저품질로 만들지 못합니다 (큰 애니메이션 GIF에도 같은 문제가 있습니다).

가능한 경우 순수 HTML5 애니메이션 효과를 사용하여 애니메이션을 코딩하는 것이 좋습니다. 렌더링 속도가 빨라지고 정적 이미지, 자바 스크립트 및 CSS 만 사용되며 현대 데스크톱 및 모바일 브라우저와 더 잘 호환됩니다.

1

유감스럽게도 iOS 기기에서 html5 동영상을 자동 재생할 수 없습니다. 적어도 iOS 5의 경우, Apple은 자동 재생과 사전로드를 모두 사용하지 못하며 제한되거나 값 비싼 모바일 데이터 계획에있는 사용자의 대역폭을 절약 할 수 있습니다.

동영상을 건너 뛰지 않는 한 유일한 해결책은 방문자가 페이지에서 무엇인가를 클릭하거나 터치하도록하는 것입니다. Mobile Safari를 사용하면 Javascript 메서드 (네이티브 플레이어 컨트롤과 반대)를 사용하여 비디오를 재생할 수 있지만 .play()에 대한 첫 번째 호출은 "클릭"또는 "터치"이벤트 처리기에서 가져와야합니다.

이 요구 사항을 iPads로 제한하고 데스크톱 브라우저에서 자동 재생을 허용 할 수 있지만 신뢰할 수있는 기능 감지 방법이없는 것 같습니다. 따라서 사용자 에이전트 문자열 (navigator.userAgent)을 구문 분석해야합니다. .

가 모바일 사파리가 비디오 않는 이상, 표준이 아닌 것들에 대한 많은 문서는 아니지만,이 문서는 매우 좋은, 자세한 정보와 몇 가지 코드 샘플이 있습니다 http://blog.millermedeiros.com/html5-video-issues-on-the-ipad-and-how-to-solve-them/

편집을 : 그리고 애플이 자체 사이트에서 사용하는이 정교하고 어리석은 해결 방법이있다. https://docs.google.com/document/pub?id=1GWTMLjqQsQS45FWwqNG9ztQTdGF48hQYpjQHR_d1WsI

관련 문제