0

我的网站上有许多来自 Vimeo 的嵌入式 iFrame。我正在重新设计它，需要使它们都适合新设计。

我可以通过将它们全部设置为 100% 宽度来轻松地使宽度适合，但是高度都不同......我如何重新调整它们的大小并保持比例？

谢谢！！

4

2 回答 2

1

使用 jquery，您可以通过以下方式获取框架的宽度和高度：

w = $("#iframe").width();
h = $("#iframe").height();

使用此信息，您可以计算给定 iframe 的纵横比（比率 = w/h）。然后您可以为每个 iframe 计算新的宽度或高度。我猜您的设计将（本质上）限制每个帧的宽度，因此您不妨将其用作基线-> newHeight = ratio * maxWidth

现在你有了新的尺寸，你可以适当地设置它们。

于 2011-09-01T22:43:19.910 回答
0

为什么要将视频宽度设置为 100% 而不仅仅是视频的实际宽度？

我想，在编写每个 iframe 元素之前，您可以：

  1. 使用 Vimeo API 获取每个视频的高度和宽度，例如http://vimeo.com/api/v2/video/8564338.json。

  2. 将 iframe 的高度设置为videoHeight * window.innerWidth / videoWidth（或类似的东西！）

对我来说看起来很hacky...

于 2011-09-01T22:40:22.327 回答