我使用以下代码来增加iframe高度。 此代码在Mozilla和IE中可以正常工作,但在Google Chrome中不能正常工作。

<script type="text/javascript">
function calcHeight()
{
    the_height = document.getElementById('the_iframe').contentWindow.document.body.scrollHeight;
    document.getElementById('the_iframe').height = the_height + 35;
}
</script>    

<iframe src="indexframe.html" id="the_iframe" onLoad="calcHeight();" name="home_frame" width="100%" frameborder="0" ></iframe>

===============>>#1 票数:0

如果您使用的是jQuery

$('#the_iframe').css({'height':(the_height+35)+'px'});

===============>>#2 票数:0

在firefox以外的地方使用document.documentElement.scrollHeight

<iframe src="indexframe.html" id="the_iframe" onLoad="calcHeight();" name="home_frame" width="100%" frameborder="0" ></iframe>
<script type="text/javascript">
function calcHeight()
{

  the_height=document.documentElement.scrollHeight;
    document.getElementById('the_iframe').height=the_height+35;


}
</script>  

===============>>#3 票数:0

跨浏览器的方式有点复杂

<iframe src="indexframe.html" id="the_iframe" name="home_frame" width="100%" frameborder="0" ></iframe>

<script type="text/javascript">
    var iframe = document.getElementById('the_iframe');

    if (iframe.addEventListener) {
        iframe.addEventListener('load', loader, false);
    } else if (iframe.attachEvent) {
        iframe.attachEvent("onload", loader);
    } else {
        iframe.onload = loader
    }

    function loader() {
        var D = iframe.contentDocument ? iframe.contentDocument :
        (iframe.contentWindow ? iframe.contentWindow.document : iframe.document),
        the_height = Math.max(
            D.body.scrollHeight, D.documentElement.scrollHeight,
            D.body.offsetHeight, D.documentElement.offsetHeight,
            D.body.clientHeight, D.documentElement.clientHeight
        );

        iframe.height = the_height+35;
    }   
</script>    

  ask by user3554339 translate from so

未解决问题?本站智能推荐:

1回复

将IFrame滚动到顶部在Chrome中不起作用

单击元素时,用户可以打开覆盖整个窗口的模式窗口DIV-其内容大约为100px高度,其余窗口将被涂黑。 由于其他原因,此overlay-div必须绝对位于top:3rem。 在可访问性方面,当打开模式窗口时,我将焦点设置为overlay-div,因此诸如VoiceOver之类的Screen
2回复

Chrome上的iframe中的分页符不起作用?

我的应用程序内部有一个iframe,如果我在某个div上添加了分页div ,则在Chrome上将其忽略(在Safari中,它可以按预期运行)。 我只有控制分页符的此打印CSS: page-break-before: always; page-break-inside: avoid;
1回复

访问iframe元素在Chrome中不起作用

我正在使用iframe,此iframe将具有img标签,因此我必须将数据从父html页面设置为iframe。 我正在通过实现这一目标 我的HTML是 我的剧本是 上面的代码正确地传递了图像数据,并在firefox中的iframe中设置了目标元素,但是在chrome中,目标
3回复

iframe.readyState在chrome中不起作用

我动态创建一个Iframe,并将一个下载二进制文件的页面设置为url (xls,doc ...)。 在下载文件时,我会显示一个动画。 什么时候不,我隐藏它。 问题是Chrome不知道文件何时完全下载,即iframe完全加载的时间。 我使用iframe属性readyState来检查if
2回复

将jQuery代码附加到iframe中不起作用

我遇到一个非常奇怪的问题! 我写了以下代码: “ iframe.html”文件仅包含对jQuery库的调用。 结果就是“ Hello world!” 在iframe中显示,但没有红色边框! 似乎$("#hello")不起作用。 实际上,如果我发出alert($("#he
2回复

材质滑块在Google Chrome中不起作用

材质滑块在Google Chrome中不起作用。 它在Firefox和IE中工作正常。 HTML 变更事件 这是jsFiddle的链接
1回复

Javascript函数在Google Chrome中不起作用

附件是我的代码。 当我单击“上传更多文件”时, addElement函数将添加一个浏览文件。 它可以在IE中运行,但不能在Google Chrome中运行。 在Chrome中,当我单击按钮时,它甚至都没有响应。
2回复

无限滚动在Google Chrome中不起作用

我有以下脚本,该脚本使页面从数据库中获取更多记录并在页面末尾加载它们。 它在Mac上的Safari 10.0中运行良好,但在Google Chrome 53.0.2785.143中无法正常运行。 如果我将Chrome浏览器窗口的大小调整为几乎与智能手机大小相同,那么它开始起作用。 当控
1回复

为什么这段代码在chrome,firefox等中不起作用?

“嗨,我是jquery的新手。当我放置jquery lib的直接源路径时,它正在工作,但是如果将其保存为jquey.js文件在本地系统中不起作用。那么我从网上看到有人说要更改脚本的字符集标签,然后我进行了更改,但仍然无法在任何浏览器中使用。”
2回复

jQuery代码在Firefox / Chrome中不起作用

该代码可在Internet Explorer中运行,尽管在Firefox和Chrome中,我得到的返回未定义。