最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
CSS实现iframe高度自适应示例
时间：2022-06-25 10:04:56 编辑：袖梨 来源：一聚教程网
前因：某个项目为了统计效果，把咨询的页面窗口内嵌放进一个单独的空页面，在这个页面里加了个统计，让人看着这个页面就跟直接进入咨询页面一样，懒得折腾啥js，直接用css弄了下，还好需求也不太高。OK了吧。
后果：因为接触iframe很少，几乎就没用过，所以当时就谷歌、百度了下，也不记得当时都搜到了些啥个内容，反正需求也不太强，就直接用css解决了
页面内嵌iframe设置宽高度为100% | 格桑的blog
目测貌似把table去掉也是可以滴，没有测试过的哦。
下面的两种方法自选其一就行了。一个是放在和iframe同页面的，一个是放在test.html页面的。
注意别放错地方了哦。
iframe代码，注意要写ID
jquery代码１：
//注意：下面的代码是放在test.html调用
$(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height()+30;
main.height(thisheight);
});
jquery代码２：
//注意：下面的代码是放在和iframe同一个页面调用
$("#main").load(function(){
var mainheight = $(this).contents().find("body").height()+30;
$(this).height(mainheight);
});
HTML代码：
Javascript代码：
相关文章
- 苹果ID登录官网入口 - 苹果Apple ID账户登录页面一键直达 12-14
- 苍云阅读app如何快速打开目录-目录入口详解 12-14
- 漫蛙漫画网页版入口-漫蛙漫画官网APP免费下载直达 12-14
- 不挂科在线搜题网页版直达入口-不挂科在线搜题网页版免登录入口 12-14
- 网页版微博官网-网页版微博在线登录入口 12-14
- 豆包在线使用-doubao.com官网登录入口 12-14