Javascript 在网页底部和接近顶部之间动态调整元素大小

我试图得到一个iframe来动态调整网页顶部150px的大小，并向下调整网页底部的大小，无论某人的浏览器有多高。主体的宽度和高度均设置为100%，并隐藏溢出

如果我的问题仍然没有意义

---

iframe应始终位于底部，距顶部150px，并且您应始终能够在iframe中看到底部元素的内容。

使用

$（window）.dimension（）

获取窗口的尺寸。使用

$（“#我的iframe”）.css（）

设置高度和宽度。

如果需要非js解决方案，请尝试将iframe包装到div中并使用css：

div{
    position: absolute;
    top: 150px;
    bottom: 0;
    right: 0;
    left: 0;
}
iframe{
    width: 100%;
    height: 100%;
}

---

以下是Jquery解决方案：

Javascript:

$(document).ready(function(){

var winHeight = $(window).height();

var frameHeight = winHeight - 150;

$("#frame").css("height",frameHeight+"px");

});

HTML-css

<iframe id="frame" src="http://goawaymom.com/messages.html"  />

#frame{
position:fixed;
top:150px;
overflow-x:scroll;

}

---

嘿，我不知道jquery，我很好奇怎么做？它能工作，我只是在演示页面上从问题开始尝试了。不过，您需要禁用iframe上的当前规则。

$(window).resize(function(){

whateverYouCalledIt();
})