Question

我正在为网站使用html5视频，并支持mp4和ogg格式。视频的高度通过CSS设置为350px。代码在这里：

<video autoplay loop>
    <source src="assets/videos/vid.ogv" type="video/ogg">
    <source src="assets/videos/vid.mp4" type="video/mp4">
    Your browser does not support the video tag.
</video>

在firefox中，代码被替换为嵌入式mp4，如下所示：

<embed width="700" height="350" src="assets/videos/vid.mp4" mode="null" autoplay="true" loop="true" pluginspage="http://go.divx.com/plugin/download/" type="video/divx"></embed>

问题是，在firefox中视频尺寸是错误的。原始视频是纵向的，firefox将其转换为横向视频，切断原始视频的底部。更改宽度和高度不起作用，因为宽高比是错误的。

我想发生的事情是firefox只使用ogg视频，看起来不错，但我不知道该怎么做。如果浏览器是FF，我尝试使用JS删除mp4行来强制ogg，但是当js运行时代码已经改为嵌入代码。有多个视频，我希望有一个比使用JS硬编码每个视频的html更好的解决方案。

谢谢！

Answer 1

将嵌入包装在div中并设置高度并设置为div。而不是设置高度和嵌入

 <Div width="700" height="350">
 <embed src="assets/videos/vid.mp4" mode="null" autoplay="true" loop="true" pluginspage="http://go.divx.com/plugin/download/" type="video/divx"></embed>
</Div>

或者只是试试这个

<Div width="700" height="350">
<video autoplay loop>
<source src="assets/videos/vid.ogv" type="video/ogg">
<source src="assets/videos/vid.mp4" type="video/mp4">
Your browser does not support the video tag.

带有firefox大小调整视频的HTML5 mp4视频

1 个答案: