老男人百科 > 百科 > 正文

iframe移除(iframe取消滚动条)

2023-04-28 00:13:27 阅读( 6902)

  该文也可以说是一个iframe自适应大小的折中解决办法。

本文也可以说是iframe自适应大小的折中方案。iframe中出现滚动条的原因是因为正文中内容的高度大于iframe的高度,所以出现了滚动条。

解决方案:

使用JQuery从iframe嵌套页面获取高度值,并在iframe父窗口的onload事件中更新iframe的高度。

具体实现代码:

父页面:

script type='text/javascript'

函数SetcwinHeight(){

var H=$('#myiframe ').内容()。查找(' meta ').属性('内容');

Alarm (h);

$('#myiframe2 ').高度(H)和

} 

/script

body style='overflow:auto;'

iframe id='myiframe' src='xx.html' onLoad='SetCwinHeight()'/iframe

/body

script type='text/javascript'

function SetCwinHeight(){

var H=$('#myiframe ').内容()。查找(' meta ').属性('内容');

alert(H);

$('#myiframe2').height(H);

}

/script

body style='overflow:auto;'iframe id='myiframe' src='xx.html' /iframe/body/html

子页面:

Html代码

meta content='800px'

工作原理:父页面读取子页面中meta的字段值来设置iframe的高度。

附加说明:

当iframe的高度小于内容高度时,如果父窗口体的overflow:auto,会有两个垂直滚动条,iframe的垂直滚动条和父窗口的滚动条;

如果此时BODY的overflow:hidden只会显示iframe的垂直滚动条,而iframe的内容是无法显示的。

专题页