最简单的方式让iframe根据内容显示高度即自适应高度

最新推荐文章于 2022-05-25 14:09:35 发布
最新推荐文章于 2022-05-25 14:09:35 发布
阅读量691 收藏
点赞数
分类专栏： web前端 文章标签： iframe border
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wangxiaojing123/article/details/7588176
版权
<iframe src="<%=basePath%>semp/detail!showDetail.action?mssAddr=<%=mssAddr %>&tblid=<%=tblid %>&recid=<%=recid %>&metadbid=<%=metadbid %>" width="770"  frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes" name="iframepage"  οnlοad="height = document.frames(this.name).document.body.scrollHeight"  ></iframe>
nice to meet you2
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
iframe根据页面内容自适应高度和宽度
09-03
iframe根据引用的页面内容自适应高度和宽度，直接查看例子，简单易操作
为什么iframe的高度和宽度不能随内容而自动调节!
曹秉毅的blog
10-22 1273
    最近,模仿一个软件的时候,发现iframe的高度和宽度不能随内容而自动调节,除非指定iframe 的宽度和高度为具体的值;问了很多朋友也都不知道.很是伤脑筋啊!后来,在W3SCHOOL中的"HTML 标签"一节中看到这么一句话:在 HTML 4.1 Strict DTD 和 XHTML 1.0 Strict DTD 中，不支持 iframe 元素.我再看看自己写的页面,但是transit
iframe自适应高度（随内容高度变化）
weixin_50641294的博客
05-25 6048
由于需求需要把一个项目的页面嵌套到另外一个页面，但是iframe高度不能写死，所以要让iframe高度自适应 1.解决思路： 获取嵌套页面的高度，把高度赋值给父页面的iframe 代码实现 1.首先在嵌套页面获取父级ifram元素 let iframeDom = parent.parent.document.getElementById("iframe") 2.获取嵌套页面高度 let box = document.getElementById("box") 3.把页面高度复制给父级ifram iframe
iframe 根据内容自适应高度-终极解决方案
reg183的专栏
07-29 628
第一中方法： 在子页面加载完毕的时候执行 parent.document.getElementById("iframe").height=0; parent.document.getElementById("iframe").height=document.body.scrollHeight; 第二中方法： 在主页面 iframe onLoad 时间里面写 function iframeLoad() { document.getElementById("iframe").height=0;
iframe自适应高度
清风的专栏
06-01 1264
http://caibaojian.com/iframe-adjust-content-height.html 内容变化 function reinitIframe(){     var iframe = document.getElementById("weixintemplate");     try{         var mainheight = $(iframe).con
iframe根据内容高度自适应：亲测有效
Korbin的博客
07-29 2077
方法一： 在子页面加载完毕的时候执行 parent.document.getElementById("iframe").height=0; parent.document.getElementById("iframe").height=document.body.scrollHeight; 方法二： 在主页面frame的onLoad时间里面写 function iframeLoad() { d...
javascript应用：Iframe自适应其加载的内容高度
10-30
然而，当嵌入的内容高度动态变化时，如何使`<iframe>`的高度自适应加载的内容高度成为一个值得关注的问题。本文将详细介绍如何利用JavaScript实现这一功能，并确保在不同浏览器中的兼容性。 #### 1. 问题背景与需求...
[转]目前找到的最好的Iframe自适应高度代码
10-31
综上所述，这段代码提供了一种跨浏览器的Iframe高度自适应解决方案，特别是在老版本浏览器中。但随着Web技术的发展，现在有许多新的API和方法，如Intersection Observer API，可以更优雅地处理这种问题，同时考虑...
iframe src为图片时的高度自适应的代码
10-30
在标准的iframe高度自适应方案中，通常是在iframe加载完毕后获取其内部body的高度（`offsetHeight`）和宽度（`offsetWidth`），然后根据这些尺寸来调整iframe自身的高度和宽度。但是这种方法对于图片并不适用，因为...
iframe自适应高度和宽度
12-08
### iframe自适应高度和宽度详解 在Web开发中，`iframe`（Inline Frame）是一种常用的HTML元素，用于在当前页面内嵌入另一个HTML文档。它能够实现页面内部局部刷新的效果，广泛应用于各种复杂的网页布局中。然而，...
iframe自适应宽度、高度 ie6 7 8，firefox 3.86下测试通过
12-11
在本问题中，我们关注的是如何使`iframe`自适应其内容的宽度和高度，并确保在不同浏览器，如IE6、IE7、IE8以及Firefox 3.86下正常工作。 首先，代码中定义了一个变量`temp_iframe`，用于存储创建的`iframe`元素。...
自动适应大小html框架,HTML的frame框架肿么自适应高度?
weixin_42131601的博客
05-30 320
高度自适应可以用Javascript你每个iframe为一个单独的页面，只需在每个单独的页面中head与/head之间加入如下代码即可实现firame高度的自适应：script type=text/javascriptfunction setWindowSize(){ //iframe自动本窗口高度try{var thiswin = window.parent.document.getElemen...
Iframe高度随内容自动调节
shaily读书学习
09-02 2178
以下两种方法会让网页中的iframe高度自动适应嵌入页的内容高度。方式一：在被嵌入页里写入代码假设main.htm文件内容：    则在iframe.htm文件中加入如下代码：            function window.onload() {         if(top.location != self.location){             var a = window.par
iframe根据内容自适应
小楼一夜听春雨
03-07 3839
使用iframe的时候，往往因为高度的问题发愁，一般情况下，我们都要让iframe进行自适应才能使得页面展示体验更好，如何自适应了？首先我们要先得到资源的文档流的高度和脱离文档流的高度，便可以做到根据内容的高度进行动态改变iframe的高度，从而实现自适应。 文档流的高度很容易获取到： let h1 = iframe.contentWindow.document....
iframe自动适应高度的多种方法方法小结
weixin_34292959的博客
11-09 429
第一种方法JQuery：跨域名适应高度，需引用jQuery,我附件上传有，可以直接下载 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script src="jquery-1.4.2.min.js" type="text/javascript">&l...
iframe 高度自适应问题
moamao_jishuyuan的博客
02-09 913
需求介绍: 项目里要往web页面埋 facebook 的投稿，接口返回资源 如下： <iframe id="hankyumensosaka" src="https://www.facebook.com/plugins/post.php?width=350&href=https://www.facebook.com/306922136507980/posts/327540447779482" width="350" height="500" style="border:none; ove
iframe 自适应
牛肉胡辣汤
10-09 4080
function reinitIframe(){ var iframe = document.getElementById("iframepage"); try{ var bHeight = iframe.contentWindow.document.body.scrollHeight; var dHeight = iframe.contentWindow.
【HTML5】iframe的高度根据页面内容自适应的方法
weixin_30367945的博客
04-13 976
方式1： 0 注意：下面的代码是放在和iframe同一个页面中调用 1 //$("#iframeId").load(function() { 2 varmainheight = $(this).contents().find("body").height() + 30; 3 $(this).height(mainheight); 4 }); ...
iframe标签外盒子高度不能根据里面的iframe内容自适应高度。
最新发布
07-28
综上所述，你可以根据以上的方法来实现iframe标签外盒子高度根据里面的iframe内容自适应高度。 #### 引用[.reference_title] - *1* [动态修改iframe高度，从而自适应内容真实高度]...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值