重新设置iframe页面的高度

时间:2024-04-08 09:42:41

 

开发工具与关键技术:VS、JS

作者:盘耀海

撰写时间:撰写时间:2019年06月06日

重新设置iframe页面的高度

iframe页面高度超出window窗口高度出现滚动条:

重新设置iframe页面的高度

重新设置高度iframe的高度把多出的的高度调整使滚动条不出现

重新设置当前window的高度 = 设置的高度

获取iframe页面的id,设置window的高度减去超出的高度加上单位px

使用js代码而不用jQuery加载可直接进入页面,window窗口出来时页面不出现滚动条

 

红色剪头为减去的合适高度:

重新设置iframe页面的高度

使用iframe加载页面设置iframe页面的宽度和高度最好为100%;同时去掉border边框。

如第一张图出现的滚动条在减去120px时刚好合适(红色框中的值),滚动条消失

——根据iframe浏览器窗口大小调整高度

reSetSize();方法调用

——reSetSize重新设置高度大小

window.onresize = reSetSize;

function reSetSize() {

  var windowsHeight = window.innerHeight;

获取iframe的id

 document.getElementById("content").style.height = (windowsHeight - 120) + "px";

 }