0

我知道有很多关于重新调整大小的帖子，iframe但我发现的只是这段代码：

<script type="text/javascript" language="JavaScript">
<!--            
        function autoResize(id) {
            var newheight;
            var newwidth;

            if (document.getElementById) {
                newheight = document.getElementById(id).contentWindow.document.body.scrollHeight;
                newwidth = document.getElementById(id).contentWindow.document.body.scrollWidth;
            }
            document.getElementById(id).height = (newheight);
            document.getElementById(id).width = (newwidth);
        };
//-->
</script>

这是示例标记代码：

<a href="index.php" target="content">Home</a>
<a href="profile.php" target="content">Profile</a>

<iframe src="index.php" name="content" height="500px" width="100%" id="Main_Content" onload="autoResize('Main_Content');"></iframe>

上面的那些代码正在工作，但我有一个问题。考虑这种情况：

index.php page height is 800px

和

profile.php page height is 1200px

当我单击index.php页面链接时，iframe 调整大小800px，然后单击profile.php页面链接并将iframe大小调整为1200px但这是我的问题，当我再次单击index.php高度小于profile.php页面的链接时，iframe没有调整大小，也没有调整800px高度，它导致内容下方有多余的空间，index.php看起来不太好，我在增加 iframe 高度时没有问题，但在缩小它时遇到了一些麻烦，任何人都可以帮帮我? 任何帮助表示赞赏。谢谢！

4

2 回答 2

0

我重现了这个问题。

问题似乎是使用 scrollHeight 和 scrollWidth 有意返回滚动条的当前或所需空间，这不等于文档本身的大小。

当我改变时，问题就消失了

 newheight = document.getElementById(id).contentWindow.document.body.scrollHeight;
 newwidth = document.getElementById(id).contentWindow.document.body.scrollWidth;

进入

 newheight = document.getElementById(id).contentWindow.document.body.style.height;
 newwidth = document.getElementById(id).contentWindow.document.body.style.width;

这对你来说是可行的，还是不在你的控制之下？

于 2013-10-12T22:28:32.607 回答
0

为什么不这样做：

height: auto;
max-height: 1200px;

在 style="" 内的 iframe 本身上或通过 css 文档。

如果 height 设置为 auto，则 index.php 不需要使用 1200px。但是在显示 profile.php 时，最多允许使用 1200 像素。

于 2013-10-12T18:31:04.220 回答