html - iframe resize 视口(viewport)相关单位

Question

我有一个带有外部源的 iframe

<iframe id="idIframe" src="https://ssl.myexternallink.php" scrolling="no"></iframe>

我想要基于 iframe 内容的自动高度。我试过:

iframe {
display: block;
background: #dedede;
border: none;     
height: 100vh;        
width: 100vw;
overflow-x:hidden;

工作完美，但如果我更改 iframe 远程页面(通过 Ajax post)，iframe 高度不会刷新。我不能像这样使用计时器解决方案:

iframeElement.contentWindow.document.body.scrollHeight;

因为作为一个外部页面，我有一个跨源访问问题。有解决办法吗？谢谢

Answer 1

没有办法完全用 HTML/CSS 来完成。看看:https://github.com/davidjbradshaw/iframe-resizer

它解决了跨域限制等引起的所有问题。