自适应iFrame高度

现在，我有一个从外部页面读取的jQuery UI弹出对话框。此页面通过流式播放器从另一个具有视频的外部进行读取。自适应iFrame高度

我使用的iframe嵌入在第一视频：

<div id="donkeyVideo"> 
<iframe id="iframeDonkey" width="100%" height="496" src="../../../../video/donkey-2009-02-23.html" frameBorder="0"></iframe> 
</div>

宽度似乎有100％的所有权利，但100％的高度不起作用。有没有解决的办法？

我在哪里以及如何嵌入代码，以及ID的东西。请任何人，帮忙？

来源

2011-05-12 Ricky

您是否尝试从父页面或子页面设置iframe高度？ – 2011-05-12 02:14:12

我不知道。该视频位于（示例）video.html中，上面的代码位于index.html中。索引从视频中读取。 – Ricky 2011-05-12 02:43:45

如果您想使用100％而不是像素值，则必须使用某种JavaScript来动态调整iframe的高度。

不幸的是，我的理解是，你不能动态地改变指向与你自己不同的域的iframe的高度。

从失在代码：

jQuery : Auto iFrame Height

请注意，这个jQuery autoHeight插件将无法借助iframe从自窗口对象从起源不同的域或远程地点访问内容合作由于JavaScript安全限制，不能从当前的域访问不同的域。

来源

2011-05-12 20:09:25 magzalez

，如果你不想使用jQuery插件，你可以简单地使用我已经在我的Facebook发布说明的方法（https://www.facebook.com/antimatterstudios/posts/10151007211674364做）

你有一个IFrame，你想自动设置高度，因为你正在从你的另一个网站托管一个页面。

不幸的是，IFrame无法取得您正在加载的内容的高度，除非您放置高度，否则它将显示默认高度或根本没有高度。这很烦人。

我为您提供了解决方案，它只适用于最新的标准支持浏览器，但也适用于IE8，因此对于99％的用户来说，它是完美的。

唯一的问题是你需要在iframe中插入一个javascript，如果你正在加载的内容属于你，这很容易，你可以打开你正在加载的内容并将javascript放入内容中。

在你的网站，你需要一段JavaScript可以“从IFrame中收到一条消息”，像这样

jQuery(document).ready(function(){ 
    jQuery(window).bind("message",function(e){ 
     data = e.data || e.originalEvent.data; 
     jQuery("iframe.newsletter_view").height(data.height); 
    }); 
});

在iframe中的内容

，在最底层添加此，可能它的确定只是做类似“$模板$的javascript”使用PHP或东西，即使JavaScript是不是我使用jQuery的标签

<script type="text/javascript" src="jquery-1.7.1-min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    parent.postMessage({ 
     height:$(document.body).height()+50+"px" 
    },"*"); 
}); 
</script>

显然里面，你没有，它只是更容易，也许你是使用它，所以省去了麻烦。

如果你这样做，当的iframe加载时，它会发出一个信号回父窗口，这将基于内容:)

的长度调整的iframe我相信你可以弄清楚如何改变这些小事情，但那就是我正在使用的方法

来源

2012-12-30 19:45:55

自适应iFrame高度

回答

相关问题