【HTML/JS】实现iFrame自适应高度，原来很简单！

最新推荐文章于 2021-08-04 15:35:58 发布
最新推荐文章于 2021-08-04 15:35:58 发布
阅读量1.4k 收藏
点赞数
分类专栏： 网页-HTML/JS

http://www.cnblogs.com/skywind/archive/2007/07/24/829550.html

<iframe id="iFrame1" name="iFrame1" width="100%" οnlοad="this.height=iFrame1.document.body.scrollHeight" frameborder="0" src="index.htm"></iframe>

看到了吧，关键就在于οnlοad="this.height=iFrame1.document.body.scrollHeight"！ 


妹子把我们叫二货
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js实现iframe自动自适应高度的方法
10-24
主要介绍了js实现iframe自动自适应高度的方法,涉及javascript操作iframe框架的技巧,非常具有实用价值,需要的朋友可以参考下
6种iframe高度自适应的方法
热门推荐
web前端开发
03-12 2万+
js自适应高度，实际上就是设置iframe的高度，设置等于内嵌网页的高度，从而看不到滚动条和嵌套痕迹。对于用户体验和网站美观起着重要作用。我们可以通过css来给它直接定义一个高度，同样可以...
html iframe自动高度,真正解决iframe高度自适应问题
weixin_33826994的博客
06-02 3836
1.前言解决iframe高度自适应问题有两种方法1.pym2.手动设置iframe的高度本文主要是总结第二种实现方式，因为第一种pym.js插件我没用懂如果使用iframe时，遇到以下的需求：iframe的高度始终等于嵌入页面内容的高度，而不是屏幕的高度右侧不允许出现两个滚动条iframe的高度自适应不仅仅是指刚加载进来时，也有可能嵌入内容的高度会随点击变化(如：下拉菜单，左侧导航栏等)页面可能同...
iframe自适应高度
半首催眠曲
05-28 574
不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能，可是 iframe的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行，现在，让我来告诉大 家一种iframe动态调整高度的方法，主要是以下JS函数： 第一种方法：代码简单，兼容性还可以，大家可以先测试下。复制代码代码如下:function SetWinHeight(obj) { var win=obj; if (document.getElementBy
HTML教程：如何设置Iframe自适应高度
qq_25150607的专栏
03-13 572
不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能，可是 iframe的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行，现在，让我来告诉大 家一种iframe动态调整高度的方法，主要是以下JS函数： 一、程序代码 　　function SetWinHeight(obj) 　　{
html获取页面高度,js获取各种高度
weixin_42122881的博客
06-04 7823
监听浏览器窗口大小改先来一个浏览器窗口大小改变的事件，用来查看浏览器窗口的大小被改变可以触发一些函数window.onresize 浏览器窗口大小改变事件window.onresize = function () {console.log('浏览器窗口的大小被改变了');something.....}复制代码在写js的时候偶尔需要获取各种高度，比如；浏览器高度，页面高度，滚动高度等。1. 网页全文...
利用location.hash实现跨域iframe自适应
12-10
www.baidu.com,假设地址：http://www.baidu.com/b.html 实现效果： A域名下的页面a.html中通过iframe嵌入B域名下的页面b.html,由于b.html的宽度和高度是不可预知而且会变化的,所以需要a.html中的iframe自适应大小....
JS解决iframe之间通信和自适应高度的问题
11-24
首先说明下，iframe通信 分为：同域通信 和 跨域通信。...的B.html页面，这两个页面数据进行通信，比如我想在父页面A.html 调用子页面当中的函数 我们很容易想到或者google下 document.getElementById('iframeA').co
iframe窗口高度自适应的实现方法
12-02
domainA 中有一个页面index.html，通过iframe嵌套了domainB中的一个页面other.html由于other.html页面在iframe中显示，而且其页面内容会动态的增加或减少，现在需要去掉iframe的滚动条由于javascript同源策略的限制...
iframe 自适应大小实现代码
01-21
A域名下的页面a.html中通过iframe嵌入B域名下的页面b.html,由于b.html的宽度和高度是不可预知而且会变化的,所以需要a.html中的iframe自适应大小. 问题本质: js对跨域iframe访问问题,因为要控制a.html中iframe的...
jquery对iframe自适应高度插件
02-23
jquery对iframe自适应高度插件是国外下载下来的。插件使用只要引用js文件就行，不用做任何别的操作完全自动化。
完美解决跨域iframe的高度自适应
05-25
完美解决跨域iframe的高度自适应,完美解决跨子域iframe的高度自适应，嵌入几个页面解决跨域iframe的高度自适应。。。
[Javascript][JS]iframe高度自适应(原创)
只会C#的程序猿
08-04 541
开发作者：Jackie Law 开发时间：2021-08-04 开发语言：Javascript 浏 览 器：Microsoft Edge(版本 92.0.902.62 ) 场景说明： 1.有A.html与B.html两个页面； 2.A.html里包含了B.html的内容(B.html通过iframe嵌套在A.html里，设iframe的ID为"iframe001"); 3.B.html的内容高度不固定； 4.A.html里包含B.html的iframe出现滚动条； 场景需求 1.让A.html页面里的ifr
js html高度自适应,js实现高度iframe高度自适应的4种方法【亲测有效】
weixin_33817338的博客
06-23 1294
摘要：使用iframe放置嵌套页面如虽然可以通过css来设置固定高度，但如果页面的高度不能确定或者高度会变化在用css来设置高度就有点不太方便了，如果能够让iframe的高度自适应的话就可以不用担心这个问题了。 使用 iframe 放置嵌套页面如虽然可以通过 css 来设置固定高度，但如果页面的高度不能确定或者高度会变化在用 css 来设置高度就有点不太方便了，如果能够让 iframe 的高...
让嵌入的iframe完美自适应宽度、高度
编程者说的博客专栏
12-11 1万+
涉及到系统集成的时候，前端我们经常会用到iframe嵌入，但是嵌入的时候经常有不适应的情况，太长或太宽、滚动条。。。 下面的方法可以做到使嵌入的iframe自适应宽度、高度， 1、嵌入iframe，加入onload事件 <iframe id="bi_iframe" src="http://xx.xx.xx.xx/yourServicePath&para1=xxx" onloa...
用iFrame Resizer解决iframe高度自适应问题
weixin_42374089的博客
05-13 4247
hhaha
iFrame 自己适应高度
sjeveryday的专栏
09-14 142
看到了吧，关键就在于onload="this.height=iFrame1.document.body.scrollHeight"！

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值