根据其中的内容高度调整 iframe 高度 [英] Resize iframe height according to content height in it
问题描述
我正在我的网站上打开我的博客页面.问题是我可以给 iframe 一个宽度，但高度应该是动态的，这样 iframe 中就没有滚动条，它看起来像一个页面...
I am opening my blog page in my website. The problem is I can give a width to an iframe but the height should be dynamic so that there is no scrollbar in the iframe, and it looks like a single page...
我尝试了各种 JavaScript 代码来计算内容的高度，但它们都给出了访问被拒绝错误并且没有用.
I have tried various JavaScript code to calculate the height of the content but all of them give an access denied permission error and is of no use.
<iframe src="http://bagtheplanet.blogspot.com/" name="ifrm" id="ifrm" width="1024px" ></iframe>
我们可以使用 Ajax 或 PHP 计算高度吗?
Can we use Ajax to calculate height or maybe using PHP?
推荐答案
直接回答你的两个子问题:不，你不能用 Ajax 做这个，你也不能用 PHP 计算它.
To directly answer your two subquestions: No, you cannot do this with Ajax, nor can you calculate it with PHP.
我过去所做的是使用 window.onload 中 iframe 页面的触发器(不是 domready，因为图像可能需要一段时间加载)将页面的主体高度传递给父级.
What I have done in the past is use a trigger from the iframe'd page in window.onload (NOT domready, as it can take a while for images to load) to pass the page's body height to the parent.
<body onload='parent.resizeIframe(document.body.scrollHeight)'>
然后 parent.resizeIframe 看起来像这样:
Then the parent.resizeIframe looks like this:
function resizeIframe(newHeight)
{
document.getElementById('blogIframe').style.height = parseInt(newHeight,10) + 10 + 'px';
}
瞧，你有一个强大的调整器，一旦页面完全呈现，没有令人讨厌的 contentdocument vs contentWindow 摆弄 :)
Et voila, you have a robust resizer that triggers once the page is fully rendered with no nasty contentdocument vs contentWindow fiddling :)
当然，现在人们会首先在默认高度看到您的 iframe，但这可以通过首先隐藏您的 iframe 并仅显示加载"图像来轻松处理.然后，当 resizeIframe 函数启动时，在其中添加两行额外的行以隐藏加载图像，并显示仿 Ajax 外观的 iframe.
Sure, now people will see your iframe at default height first, but this can be easily handled by hiding your iframe at first and just showing a 'loading' image. Then, when the resizeIframe function kicks in, put two extra lines in there that will hide the loading image, and show the iframe for that faux Ajax look.
当然，这仅适用于同一个域，因此您可能希望有一个代理 PHP 脚本来嵌入这些内容，一旦您到达那里，您不妨将博客的 RSS 提要直接嵌入到您的网站中PHP.
Of course, this only works from the same domain, so you may want to have a proxy PHP script to embed this stuff, and once you go there, you might as well just embed your blog's RSS feed directly into your site with PHP.
这篇关于根据其中的内容高度调整 iframe 高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
