在第一次加载页面时，在父页面调用iframe.onload事件来改变iframe的高度，使得iframe高度自适应但是当iframe中内容变高时，页面就会出现滚动条，我如何监听页面高度的变化，使得页面变高的时候改变iframe的高度
1 回答
Qyouu
TA贡献1786条经验 获得超11个赞
你可以多加一个绝对定位宽度为0高度100%的iframe在body里面，然后监听这个iframe的resize事件，当文档的高度变化，就会触发这个事件
<html>
<head>
<style>
body {
position: relative;
}
.ref {
position:absolute;
top: 0;
left: 0;
height:100%;
width:0;
border: none;
background-color: transparent;
}
</style>
</head>
<body>
<div>
<p>hello world</p>
</div>
<!--这是用来监听文档高度变化的iframe-->
<iframe class="ref"></iframe>
<!--这是正常显示内容的iframe -->
<iframe src="xxx"></iframe>
<script>
var iframeWindow = document.querySelector('.ref').contentWindow;
iframeWindow.onresize = function() {
console.log('doc height changed');
//在这里改变正常显示内容的iframe的高度
};
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消