Question

我一直在玩代码，我似乎无法让它工作。我用谷歌搜索，在这个网站上搜索了13页，我仍然无法找到我正在寻找的答案。

我希望视频以特定尺寸开始，然后在我调整浏览器大小（从桌面到iPad / iPhone）时缩小。

我尝试过以下操作，但视频保持不变。没什么可扩展的。

<div id="myVideo" style="width:640px; height:360px">
    <video id="player1" width="100%" height="100%" style="width:100%; height:100%;">
        <!-- Pseudo HTML5 -->
        <source type="video/youtube" src="http://www.youtube.com/watch?v=nOEw9iiopwI" />
    </video>
</div>

我应该做些什么？

Answer 1

将视频节点的高度/宽度属性设置为原始视频大小，但保持样式宽度/高度为100％

<video id="player1" width="640px" height="360px" style="width:100%; height:100%;">

然后根据需要调整myVideo div的大小，mejs应按预期响应

Answer 2

嗯，您在#myVideo div上设置了特定大小（640px 360px），因此内部的视频元素是该框的100％。如果删除像素尺寸 - 或尝试将它们更改为max- - 它应该是可缩放的。

Answer 3

这很有效。 myvids div中的width =“50％”适用于IE。没有它，视频就无法正常填充播放器。视频属性的顺序似乎很重要。

<div class="myvids" id="viddivap1" width="50%" style="width:100%; position:relative;">
    <video class="thevid" width="640" height="360" style="max-width:100%; height:100%;" id="my_video_ap1" preload="auto" autoplay controls="controls" >
        <source type="video/youtube" src="http://www.youtube.com/watch?v=FAGL9gxhdHM" />
    </video>
</div>

如何制作MediaElement.js流体？

3 个答案: