HTML5 видео «Черный экран» на iPad - PullRequest
13 голосов
/ 22 февраля 2011

Я создаю веб-сайт, на котором есть видео. Этот веб-сайт также предназначен для пользователей iPad, но в данный момент у меня возникли проблемы с тегом ol 'video. У меня есть видео, которое хорошо воспроизводится в браузерах, но не на iPad, к сожалению.

У меня просто черный экран с iPad, и я не вижу сообщений об ошибках.

Вот мой код для видео:

<video id="movie" width="790" height="250" controls >
    <source src="anim/intro.ipad.mp4"  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
    <source src="anim/intro.webm" type='video/webm; codecs="vp8, vorbis"'>
    <source src="anim/intro.theora.ogv"  type='video/ogg; codecs="theora, vorbis"'>
</video>
<script>
    var v = document.getElementById("movie");
    v.onclick = function() {
        if (v.paused) {
            v.play();
        } else {
            v.pause();
        }
    };
</script>

Все видео были созданы после уроков о HTML5 видео. Все они были закодированы с использованием предпочтительных настроек iPad в Miro Video Converter.

Просто рассмотрим это (я не уверен, что так будет). Я тестирую видео на симуляторе iPad.

Независимо от того, что я делаю, я просто не могу воспроизвести видео:

on iPad Simulator

Ответы [ 2 ]

3 голосов
/ 22 февраля 2011

Вы уверены, что правильно поняли кодировку?
Попробуйте это, чтобы проверить это:

<video src="anim/intro.ipad.mp4" controls>  
      Your browser does not support the video element.  
</video>  
1 голос
/ 22 февраля 2011

Ваш файл .htaccess правильно обслуживает определенные видеофайлы?

Убедитесь, что ваш сервер использует правильные типы MIME.Firefox не будет воспроизводить видео Ogg, если mime-тип неправильный.Поместите эти строки в ваш файл .htaccess, чтобы отправлять браузерам правильные типы пантомимы

AddType video/ogg  .ogv
AddType video/mp4  .mp4
AddType video/webm .webm

Ссылка: Видео для всех

Также выизменить элемент видео с помощью позиционирования?Я обнаружил, что это создает этот черный видео экран тоже.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...