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>

基于互联网精神,在注明出处的前提下本站文章可自由转载!

本文链接:https://ranjuan.cn/html-iframe-auto/

赞赏

微信赞赏支付宝赞赏

发表评论