例如:
<iframe name="Stack" src="http://stackoverflow.com/" width="740"
frameborder="0" scrolling="no" id="iframe"> ...
</iframe>
我希望它能够根据其中的内容调整其高度,而不使用滚动.
我自己正在寻找一个简单的解决方案,用它中的内容来改变iframe的高度.
似乎规则是你不能从持有它的页面获得iframe的高度.这是因为安全性显而易见.我们应该怎么做？
我正在尝试将iframe height参数更改为iframe中加载的页面的相同px.在iframe中加载的页面来自另一个域.
将在iframe内部加载不同的页面,从而导致iframe内容的高度发生变化,因此我需要获取iframe内容高度并将其应用于iframe height参数.
这是我正在谈论的一个例子:http://jsfiddle.net/R7Yz9/3/
<div class="site"><a href="http://amazon.com/" target="_top">Amazon </a></div>
<div class="site"><a href="http://cnn.com/" target="_top">Cnn </a></div>
<div class="site"><a href="http://wikipedia.org/" target="_top">Wikipedia </a></div>
<iframe id="source" src="http://amazon.com/" frameborder="0" scrolling="no" width="100%" height="100%"></iframe>
.
$(document).ready(function() {
var iframe = $( "#source" );
$( "a[target=_top]" ).click( function(){
iframe.attr( "src", this.href );
return false;
});
});
我正在尝试根据它的内容调整大小(变大或变小)iframe.单击每个页面后,将调用一个调整大小的方法.
在Chrome中,我可以使iframe更大,但不能更小.document.body.scrollHeight始终是最大的价值.
因此,如果一个大页面设置了#iframe.height ='620px',并且有人点击链接到页面的内容较少,则scrollHeight将保持在620px而不是减少.
在Chrome/Safari中处理此问题的正确方法是什么？
来自Apple 开发者常见问题解答
Safari附带了保守的cookie策略,该策略将cookie写入仅限于用户选择("导航到")的页面.
默认情况下,Safari仅允许您直接导航到的网站的Cookie.(即,如果您点击具有该域名的URL的链接).
这意味着,如果您使用带有来自其他网站的网页的iFrame从您自己的网站加载网页,则其他网站无法设置Cookie.(例如,售票处).一旦您直接访问了其他域,另一个站点就能够访问和更改自己的cookie.
如果无法访问其他网站上的代码,我怎样才能使用户体验尽可能不引人注目？
是否有(javascript？)方式检查其他网站的cookie是否已设置,并相应地,如果需要,首先显示与其他网站的直接链接？
更新:
HTML5功能'window.postmessage'似乎是一个不错的解决方案.
有一些jQuery库可能有所帮助,并且与最新的浏览器兼容.
本质上,iFrame文档通过窗口元素与Json一起发送消息.
非常好的Postmessage插件,由daepark,我工作.
另一个jQuery postMessage,由Ben Alman发现,但我没有测试过.
我可以在以下链接中看到iframe; -
iframe是屏幕中心的在线预订.我遇到的问题是虽然iframe的高度在页面加载时是可以的,但是我需要它以某种方式在页面内容调整时自动调整高度.例如,如果我在在线预订中进行邮政编码搜索,则会创建一个下拉菜单,然后使"下一步"按钮无法查看.
我需要做的是,当在线预订的内容发生变化时,iframe会自动调整到iframe的新高度(动态),因为它没有加载任何其他页面.
我已尝试使用jquery尝试解决此问题的几个不同的脚本,但它们似乎只在页面首次加载时自动调整iframe的高度而不是 iframe的内容更改.
这甚至可能吗？
我目前的代码目前是设定的高度: -
<div id="main-online-booking">
<iframe id="main-online-frame" class="booking-dimensions" src="http://www.marandy.com/one2oneob/login-guest.php" scrolling="no" frameborder="0"></iframe>
</div>
#main-online-booking {
height: 488px;
border-bottom: 6px #939393 solid;
border-left: 6px #939393 solid;
border-right: 6px #939393 solid;
z-index: 4;
background-color: #fff;
}
.booking-dimensions {
width: 620px;
height: 488px;
}
如果有人可以帮助我,我将不胜感激!
我使用了iframe,如下所示:
<iframe style='width: 330px; height: 278px' scrolling='no' name="iframeId" class="advPlayer" id="iframeId" frameborder="0" src='../../player/iabpreview.php?adid=<?php echo $selectedAdIdx ?>&autoPlay=true'></iframe>
每当我点击a时<div>,我都要更改iframe的来源.我使用以下代码:
if ($j.browser.msie) {
frames['iframeId'].window.location="../player/iabpreview.php?adid="+adId+"&autoPlay=true";
}else {
$j(".advPlayer").eq(0).attr("src", "../player/iabpreview.php?adid="+adId+"&autoPlay=true");
}
这适用于Firefox,但不适用于Internet Explorer.
什么代码也适用于Internet Explorer？
我有一个已发布的Google文档的iframe.该文档的内容可能会发生变化,因此我想根据内容自动调整iframe的高度.我找到了一些解决方案,但它们都需要访问子文档的头部.有没有人知道如何做到这一点？
您可以查看我在下面使用的代码的摘录:
#faq{
height: 800px;
overflow: hidden;
position: relative;
width: 660px;
border-top: 1px solid #90C547;
border-bottom: 1px solid #90C547;
}
<div id="faq"><iframe id="faqif" src="https://docs.google.com/document/..../pub?embedded=true" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:900px;width:832px;position:absolute;top:-92px;left:-150px;right:0px;bottom:0px;z-index:0;" height="900px" width="832px"></iframe></div>
我有一个iframe页面,里面有一个html文档.我需要从那个子文档中访问iframe的id,并且没有运气使用jQuery.基本结构是在我的页面内:
<div id="ContainingDiv">
<iframe id="ContainingiFrame">
<html>
<head></head>
<body>
</body>
</html>
</iframe>
</div>
在我的javascript方法中,我可以<body>使用jQuery选择器获取标签中的任何内容,但无法检索iframe元素以调整其大小.我已经尝试过一些东西,但我确实不是jQuery DOM导航方面的专家,特别是在涉及iframe的情况下(iframe与包含页面在同一个域中.)有没有办法可以做到这一点？