12

有谁知道如何为不支持该标签的浏览器显示图像?显示文本,例如:

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

很简单,但是如果我用 img 标签替换文本,它总是会显示图像,即使浏览器确实支持 video 标签。

感谢您分享您的知识

(编辑)事实并非如此,我的测试是错误的,并且 img 标签确实只有在不支持视频时才会呈现(例如 Safari 5)

4

3 回答 3

22

我只是在检查这个链接,以及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>
于 2012-03-15T16:03:24.100 回答
3

使用 javascript,您可以运行:

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

这取决于您是否有支持,这将是对还是错。然后,您可以使用 javascript 将视频标签替换为图像,或者更简单,只需将视频设置为display:none;,图像设置为,display:block;反之亦然。

于 2012-03-15T16:08:02.020 回答
0

可以使用视频标签的海报属性。

<video controls poster="/images/w3html5.gif">

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

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_video_poster

注意: 这不支持 Internet Explorer。

于 2021-03-29T13:52:23.067 回答