javascript - MediaElement.js - 如何动态调整视频大小？

Question

我知道如何加载不同尺寸的视频，但我不知道如何更改它们。例如，在我的应用程序中，可以调整视频面板的大小——然后我想调整视频的大小。问题是，创建了多个元素，我试图避免调整每个子元素的大小，而只是使用一些内置函数。

发现 this option但这似乎是一个粗略的解决方案。

Answer 1

<div id="video-wrapper">
    <video width="640" height="360" style="width: 100%; height: 100%;" id="player1">
        <source/>
    </video>
</div>

通过作为 2.9.3 下载的一部分的 demos/mediaelementplayer-responsive.html 文档(也在 github 上)。我知道内联样式很难看但是......它有效!我只是根据需要调整视频包装器的大小(jquery 示例):

var newHeight = 360 / 640 * newWidth;
$('#video-wrapper').css('width',newWidth);
$('#video-wrapper').css('height',newHeight+'px');