Question

我正在使用iFrame Resizer在页面上嵌入跨域iframe。效果很好，直到我单击iframe内的链接将我带到下一页为止。

在iframe源页面（远程页面）中，标题中包含以下代码：

<script src="https://cdn.jsdelivr.net/npm/iframe-resizer@3.6.1/js/iframeResizer.contentWindow.min.js"></script>

在嵌入iframe的页面中：

<iframe id="crelate-iframe" src="https://foo.bar" frameborder="0" width="100%" scrolling="no">
</iframe>

，并在页面的页脚中：

<script type='text/javascript' src='https://cdn.jsdelivr.net/npm/iframe-resizer@3.6.1/js/iframeResizer.min.js?ver=1'></script>

<script>
(function($) {
    $(function() {
        $('#crelate-iframe').iFrameResize({
            log: true,
            heightCalculationMethod: 'lowestElement'
        });
    });
})(jQuery);
</script>

据我所知，日志并没有提供太多。我只能看到它最初会调整iframe的高度，但是当我单击它时并没有调整它，并且当下一页的高度较小时，我最终在底部留有一堆空白。

有什么想法会导致这种情况吗？

Answer 1

您加载到iFrame中的每个页面都需要添加脚本

<script src="https://cdn.jsdelivr.net/npm/iframe-resizer@3.6.1/js/iframeResizer.contentWindow.min.js"></script>

单击iframe内的链接后如何调整iframe的大小

1 个答案: