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

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

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

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

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

(EDIT) это не так, мои тесты были неправильными, и тег img действительно отображается только тогда, когда видео не поддерживается (например, Safari 5)

2 ответов


Я просто проверял этой ссылке, а также в 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>

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

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

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