percentage - 适合 div 的 video.js 大小

Question

我有一个 video在 div宽度为 40%。在 html 中，width="100%" height="auto"使视频消失。以像素为单位设置特定大小不适合 div .将 html 留空会使视频大小错误，并且两侧带有黑条。

我已经尝试了大多数其他帖子中的建议，但似乎无法让它发挥作用。

<div id="box"><video id="trialvid" class="video-js vjs-default-skin"
  controls preload="auto" width="auto" height="auto" poster="images/reelthumbnail.jpg"
  data-setup='{"example_option":true}'>
 <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
 <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
 <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
</video>
</div>

Answer 1

在 videojs 的第 5 版中，您可以使用 vjs-16-9 vjs-4-3视频对象类，

<video class="video-js vjs-default-skin vjs-16-9" ...>
...
</video>

或使用 fluid选项

<video class="video-js vjs-default-skin" data-setup='{"fluid": true}' ...>
...
</video>

来源: https://coolestguidesontheplanet.com/videodrome/videojs/