javascript - iframe 高度在页面内容较长后不会缩小

标签 javascript jquery iframe iframe-resizer

将 David Bradshaw iFrame Resizer 代码用于动态 iframe。 最初,它会工作并根据内容设置 iframe 的适当高度。 但是,当用户单击链接转到 iframe 内的另一个页面时,如果内容较少,高度不会缩小。如果内容更多,它会放大就好。

我尝试使用 heightCalculationMethod 的各种属性,结果都是相同的。我查看了较小页面的 iframe 的内容,我看到的是一个 html 表格(没有定义的高度),然后在 body 标记内部有一个巨大的间隙(也没有定义的高度)高度)。 我在这里缺少什么?

这是我的脚本..

<script>
iFrameResize({
    log:true,
    enablePublicMethod:true,
    heightCalculationMethod:'lowestElement'
});
</script>

是否可以只重置 iframe 高度?

最佳答案

引自https://github.com/davidjbradshaw/iframe-resizer

IFrame not downsizing

The most likely cause of this problem is having set the height of an element to be 100% of the page somewhere in your CSS. This is normally on the html or body elements, but it could be on any element in the page. This can sometimes be got around by using the taggedElement height calculation method and added a data-iframe-height attribute to the element that you want to define the bottom position of the page. You may find it useful to use position: relative on this element to define a bottom margin or allow space for a floating footer.

Not having a valid HTML document type in the iFrame can also sometimes prevent downsizing. At it's most simplest this can be the following.

关于javascript - iframe 高度在页面内容较长后不会缩小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33926113/

相关文章:

javascript - 如何从父文档捕获 iframe 内的刷新?

html - 为什么 google.com 不在 iFrame 中加载

javascript - 如何重构此 Vue Js 代码以避免使用本地存储?

javascript - XML/javascript 解析节点 - 按名称指定子节点

JQuery 在 IE 中无法正确解析 attr ("href")

javascript - 如何编写一个可以适应稍微不同的用例的 JavaScript 模块?

javascript - 如何在 DOM 创建过程中用 js 脚本替换 HTML 标签

javascript - 在单独的 iframe 中从 .php 刷新 iframe

javascript - React : Componentdidupdate, 无法访问对象值

javascript - 如何在检查该页面时提取显示为 # 的页面的实际 href