В IE9 HTML5 Видео поддержка
у меня возникли проблемы с отображением видео HTML5 в IE9, я добавил различные типы в свой htaccess
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
Это то, что у меня есть как html
<video id="video" autoplay loop preload>
<source src="video/final_loop.mp4" type="video/mp4" />
<source src="video/final_loop.webm" type="video/webm" />
<source src="video/final_loop.ogg" type="video/ogg" />
Your browser does not support the <code>video</code> element.
</video>
Я также попытался преобразовать видео в формат Theora ogv и использовать
<source src="video/final_loop.theora.ogv" type="video/ogv" />
но это тоже не работает, подумал я .ogg поддерживался в IE9?
7 ответов
на официальном сайте Microsoft есть этот фрагменты кода для видео на IE9
<video width="400"
height="300"
src="video.mp4"
poster="frame.png"
autoplay
controls
loop>
This content appears if the video tag or the codec is not supported.
</video>
попробуйте с этим кодом.
Internet Explorer 9 поддерживает MPEG4 с помощью кодека H. 264. Но также требуется, чтобы файл мог начать играть, как только он начнет загрузку.
вот самые основные шаги о том, как сделать файл MPEG, который работает в IE9 (используя avconv на Ubuntu). Я потратил много часов, чтобы выяснить это, поэтому я надеюсь, что это может помочь кому-то еще.
-
преобразование видео в MPEG4 с помощью кодека H. 264. Вам не нужно ничего причудливого, просто позвольте avconv сделать работу для ты:
avconv -i video.mp4 -vcodec libx264 pre_out.mp4
-
это видео будет работать во всех браузерах, поддерживающих MPEG4, кроме IE9. Чтобы добавить поддержку IE9, вам нужно переместить информацию о файле в заголовок файла, чтобы браузер мог начать его воспроизведение, как только он начнет его загружать. ЭТО КЛЮЧ ДЛЯ IE9!!!
qt-faststart pre_out.mp4 out.mp4
qt-faststart
- это утилиты Quicktime, которые также поддерживают формат файлов H. 264 / ACC. Это часть .
вы пытаетесь использовать это в IIS?
Если это так, вам нужно добавить соответствующие типы mime для распознавания ваших видеофайлов:
<configuration>
<system.webServer>
<staticContent>
<!-- Video -->
<mimeMap fileExtension=".mp4" mimeType="video/mp4"/>
<mimeMap fileExtension=".webm" mimeType="video/webm"/>
</staticContent>
</system.webServer>
<system.web>
<compilation debug="true" targetFramework="4.0" />
</system.web>
</configuration>
вот разметка, которая работает для меня в IE9 (в корневой папке, у меня есть папка "видео" в "Мои файлы"):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Video Demo</title>
</head>
<body>
<video id='movie'
autoplay
controls
loop
preload=auto
playbackRate="1"
width="800">
<source src="video/video.mp4" type='video/mp4' />
<source src="video/video.webm" type='video/webm' />
</video>
</body>
</html>
Как уже упоминалось, IE9 не поддерживает OGV, только MP4 и WebM (с плагином). Я столкнулся с большим количеством проблем даже с MP4, который должен играть изначально, прежде чем узнать, что одна вещь, которую следует учитывать при обслуживании файлов MP4 для IE9, - это метаинформация файла, называемая Moov atom, встроенная в сам файл MP4. Если он находится в конце файла, где некоторые кодеры, включая ffmpeg помещает его, IE9 не начнет воспроизведение видео, если весь видеофайл загруженный. Перемещение метаданных Moov atom в начало файла позволяет прогрессивно загружать файл MP4, а IE9 хорошо обрабатывает видео.
есть инструмент под названием qт-служба FastStart для выполнения этой операции. Творил чудеса для меня, компилируя и используя версию командной строки Linux, распространяемую с ffmpeg.
make tools/qt-faststart
sudo cp tools/qt-faststart /usr/local/bin/
qt-faststart original_file.mp4 modified_file.mp4
посмотреть этой страница; это обеспечивает решение проблемы плаката с IE9
, и расширяется на видеокодеках:
простые CSS
и условные операторы сделали свое дело. Я теперь придерживаюсь мнения, что плакаты должны быть размещены в начале (Первый кадр) и в конце (последний кадр) видео, как если бы они были обложками альбомов. Таким образом, изображение в начале и конце видео даст зрителю некоторое визуальное представление о том, почему они должны воспроизводить видео (так же, как причина, по которой вы иногда покупаете альбом, - это обложка).
имейте в виду, что для IE9 Источник видео должен быть указан в атрибуте " src " самого тега видео.
Я предлагаю вам обнаружить IE9 специально и добавить это свойство в тег видео. Вам нужно сделать это специально для IE9, потому что Firefox на OSX не примет видеофайл MP4 в теге src.
надеюсь, что это помогает!