嵌入在 iframe 中的页面中的 YouTube 视频在 Firefox 中不起作用答案

【问题标题】：YouTube video in page embeded in iframe not working in Firefox嵌入在 iframe 中的页面中的 YouTube 视频在 Firefox 中不起作用
【发布时间】：2012-10-09 22:45:55
【问题描述】：

我认为这是 Firefox 中的一个错误，但只是想我会在这里检查一下。

我的网页上有一个 iframe，其中包含一个包含嵌入式 youtube 播放器的页面（在 iframe 内）。这在 Firefox 中运行良好。

但是，当我添加以下 CSS 规则时：

iframe {
  transform: scale(0.75, 0.75);
  -moz-transform: scale(.75, .75);
  -webkit-transform: scale(.75, .75);
  -o-transform: scale(.75, .75);
  -ms-transform: scale(.75, .75);
}

对于外部 iframe，YouTube 视频仅在 Firefox 中停止工作。它适用于 Chrome、Opera 和 Safari。

这是 Firefox 的错误吗？

这是一个 JSFiddle 示例 http://jsfiddle.net/6C65Y/28/

【问题讨论】：

您可以将大小传递给 iframe ：width="560" height="315"

标签： javascript html iframe youtube

【解决方案1】：

firefox 似乎不管理 iframe 上的 CSS 缩放。

此代码将起作用：

var previewFrame = document.getElementById('test');
var preview =  previewFrame.contentDocument ||  previewFrame.contentWindow.document;
preview.open();

var code = '<!doctype html><title>Test</title><h1>YouTube video</h1><iframe src="http://www.youtube.com/embed/64qx95Ckrwc" width="75%" height="75%"></iframe>';

preview.write(code);
preview.close();

【讨论】：

我认为这是 Firefox 中的一个错误。我的页面实际上还有很多内容，我需要根据浏览器的大小动态缩放 iframe。