Видео не загружается в Chrome, но работает в Safari

Question

Мне нужно загрузить видеоролик 30sec mp4. Когда я загружаю свой HTML в Safari, он отлично работает, все загружается и воспроизводится видео; однако, когда я загружаю свой HTML-файл в Chrome, видеофайл не загружается. У меня есть файл шаблона с тем же кодом (другое видео), которое загружает видео в Chrome.

Может быть проблема с видеофайлом? Это .mp4, но у него нет H.264 в качестве кодека.

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

<section id="video"> 
    <!--video width = "640" height = "480" autoplay = "false" controls>--> 
    <video width = "540" height = "380" controls> 
    <source src="video/manchester.mp4"/> 
</section> 

И CSS:

section #video { 
    position: relative; 
    float: right; 
    width: 50%; 
    margin-top: 100px; 
} 

Я использую Mac OS X, и я экспортировал видео файлов через IMOVIE.

Answer 1

Safari попытается воспроизвести весь видеоконтент с Quicktime, поэтому он будет очень просить, в каком формате он находится. Для того чтобы он мог играть в Chrome, файл должен быть H.264 или WebM. См. Эту ссылку для получения информации о том, какие форматы поддерживаются: https://developer.mozilla.org/en-US/docs/HTML/Supported_media_formats

Для обеспечения максимальной совместимости вы должны иметь доступное видео, по крайней мере, для H.264 MP4 и WebM, и убедитесь, что ваш профиль H.264 находится в Main 3.1 или аналогично, чтобы обеспечить его воспроизведение на мобильных устройствах.