Как отобразить изображение, если браузер не поддерживает тег HTML5 <video> - PullRequest
Новая
       35

Как отобразить изображение, если браузер не поддерживает тег HTML5 <video>

10 голосов
/ 15 марта 2012

Кто-нибудь знает, как я могу отобразить изображение для браузеров, которые не поддерживают тег? Отображение текста, такого как: 

<video src="video.mp4" type="video/mp4">
    Your browser does not support the <video> tag
</video>

Это просто, но если я заменю текст тегом img, он всегда будет показывать изображение, даже если браузер поддерживает видео тег.

Спасибо, что поделились своими знаниями

(РЕДАКТИРОВАТЬ) Это не так, мои тесты были неверными, и тег img действительно отображается только тогда, когда видео не поддерживается (например, Safari 5)

Ответы [ 2 ]

20 голосов
/ 15 марта 2012

Я просто проверял эту ссылку , а также спецификацию HTML5 , поэтому этот код должен работать для вас: 

<video controls="controls" poster="<your image poster if applicable>">
    <source src="video.mp4" type="video/mp4" />
    <img src="<your No video support image>" title="Your browser does not support the <video> tag" />
</video>
3 голосов
/ 15 марта 2012

Используя javascript, вы можете запустить: 

var html5video = !!document.createElement('video').canPlayType;

Это будет правда или ложь в зависимости от того, есть ли у вас поддержка или нет. Затем вы можете использовать javascript, чтобы заменить тег видео на изображение, или, проще, просто установить для видео значение display:none; и для изображения display:block; или наоборот.

...