Question

我目前在我的网站上嵌入了vimeo视频。（以下代码）

<iframe src="http://player.vimeo.com/video/4415083?api=1;title=0&amp;byline=0&amp;portrait=0&amp;color=d01e2f&amp;autoplay=1" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

正如您所看到的，我已经自动播放，并且它也使用上面的代码调整到全宽。我的问题是我刚刚在wideo.co上创建了一个视频，我需要它以与上面的vimeo iframe完全相同的方式做出反应。下面是我的Wideo iframe，有人可以告诉我我是如何尝试过但似乎无法做到这一点。

<iframe width="540" height="310" src="http://www.wideo.co/embed/7022711418637317834?height=300&width=500" frameborder="0"></iframe>

Answer 1

全宽视频有点棘手。没有一个尺寸适合所有人，但这是它的要点：

创建一个包含基于百分比 padding-top的包装DIV（注意：该值会根据您的具体情况而变化 - 您需要使用此值，获取计算器，使用开发工具......你会搞清楚的。）
将{if 1}内的iframe定位在DIV中，其顶部和底部设置为0
将iframe宽度和高度设置为absolute

以下是一些代码：

auto

如果你很懒，你也可以前往fitvidsjs来处理创建包装DIV并为你计算填充。它是一个很棒的代码，工作得很好，不需要计算器。我可以比我下载最新的fitvids更快地计算填充，将其上传到我的服务器，并在代码中引用它......但那就是我。

Answer 2

将内容放入div中，然后添加width =＆＃34; 100％＆＃34;到iframe代码。将自动播放添加回代码。

<div style="overflow: hidden;">
<iframe src="http://www.wideo.co/embed/7022711418637317834?height=300&width=500&autoplay=1" width="100%" height="310" frameborder="0"></iframe>
</div>

将视频放入100％宽度和自动播放的iframe中

2 个答案: