如何改变iframe内容的高度?

时间:2012-11-15 21:11:10

标签: javascript jquery html css css-position

我有一个iframe加载到我网站的页面中,我需要根据iframe内容的高度动态设置它到页面的中心位置,我对代码没有任何问题。除了iframe内容的高度永远不会返回低于内容变得更小(如果有意义)的值时的值。

js会识别内容高度何时增长,但不会在内容高度缩小时识别。

E.g。如果我有一个400px高的页面,然后一些内容动态变为420px,我的代码将识别出它是420px高,但是如果它变为350px,我的代码将仍然看作是高420像素。我该如何解决这个问题?

代码:

function place()
{
    var w = $(window).width();
    w-=1000;
    w/=2;
    if(w<12)
    w = 12;
    $("#div").css("left",""+w+"px");
    $("#closeDiv").css("left",""+(w-12)+"px");

    var h = $(window).height();
    var ifh = document.getElementById("inner").contentWindow.document.body.scrollHeight;
    document.title = ifh;
    h -= ifh;
    h /= 2;
    if(h < 20)
    h = 20;
    $("#div").css("top",""+h+"px");
    $("#div").css("height",""+ifh+"px");
    $("#closeDiv").css("top",""+(h-12)+"px");
}

文档标题继续显示420px,即使我知道内容小于该值。 .offsetHeight也会出现同样的问题。

感谢您的帮助!

解决方案更新

好的,所以我使用了我标记为解决问题的答案中的代码,因为我确实使用了它,它值得我帮助解决这个问题,但这里涉及的实际问题是我有高度iframe设置为容器盒的100%;一旦我将其设置为99%,就解决了问题。不知道为什么......但是嘿!

感谢您的所有帮助!

1 个答案:

答案 0 :(得分:0)

尝试类似:

var iHeight;
if ($("iframe").length > 0) iHeight = $($("iframe")[0].contentDocument || $("iframe")[0].contentWindow.document).height();

虽然良好的老式电话应该有效:

var iHeight;
if ($("iframe").length > 0) iHeight = $("iframe").height();