2016年03月25日 经验积累
iframe页面并不能撑开父容器div,使得页面看起来并不协调。解决方法是:
使用JavaScript监听iframe元素的load事件,然后根据iframe中document的高度来动态调整iframe窗口的高度。
<iframe id="testFrame" sandbox="allow-same-origin" src="sub.html"></iframe> <script type="text/javascript"> var testFrame = document.getElementById('testFrame'); testFrame.addEventListener('load', function() { testFrame.height = getHeight(testFrame.contentDocument);; }); function getHeight(doc) { var body = doc.body, html = doc.documentElement; var height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight ); return height; } </script>