染卷不卷'blog

12年站长,AI实践中。互联网 IT行业,工作见闻、技术教程全分享。

学习资料

html内嵌iframe网页高度自适应

使用iframe标签将目标网页内嵌在自己网页中,隐藏iframe边框和滚动条。iframe自适应内嵌网页高度。

<script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
 
<iframe src="https://ranjuan.cn" frameborder="0" scrolling="no" id="external-frame" style="width:100%" onload="setIframeHeight(this)"></iframe>
<script type="text/javascript">
 
function setIframeHeight(iframe) {
if (iframe) {
var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
if (iframeWin.document.body) {
iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight;
}
}
};
 
window.onload = function () {
setIframeHeight(document.getElementById('external-frame'));
};
</script>
染卷

本站文章也会定期同步到微信公众号,可以关注下避免错过~

建站 12年 16天
微信公众号

发表评论

邮箱不会公开,带 * 为必填。