博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery 实现iframe 自适应高度
阅读量:6965 次
发布时间:2019-06-27

本文共 643 字,大约阅读时间需要 2 分钟。

转自:

超级简单的方法,也不用写什么判断浏览器高度、宽度啥的。
下面的两种方法自选其一就行了。一个是放在和iframe同页面的,一个是放在test.html页面的。

注意别放错地方了哦。


iframe代码,注意要写ID


<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>

jquery代码1:

//注意:下面的代码是放在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代码2:

//注意:下面的代码是放在和iframe同一个页面调用
$("#main").load(function(){

var mainheight = $(this).contents().find("body").height()+30;
$(this).height(mainheight);
}); 

测试过,第二种有效,不过要注意一点是,增加的JS要写在iframe下面,放在头部是测试没有效果。
测试代码:

 

                

 

 

 

 

 

 

 

 

 

转载地址:http://lyisl.baihongyu.com/

你可能感兴趣的文章
数据库连接池的工作原理
查看>>
网络抓包工具wireshark and tcpdump 及其实现基于的libpcap
查看>>
市值410亿美元!VR内容在5年后将成下一座金矿
查看>>
easyui的combobox根据后台数据实现自动输入提示功能
查看>>
ASP.NET MVC WEB API必知必会知识点总结
查看>>
Test2 unit6
查看>>
sql注入<二>
查看>>
26、OSPF配置实验之不规则区域虚链路
查看>>
[C++再学习系列] 引用和指针
查看>>
未能加载文件或程序集“********”或它的某一个依赖项。试图加载格式不正确的程序。...
查看>>
bootstrap4-图像
查看>>
Centos7 MariaDB10.1.22编译安装
查看>>
路由器配置基础(中)
查看>>
/etc/sudoers的配置
查看>>
菜鸟学Linux 第075篇笔记 mysql事务,视图
查看>>
Mysql + PHP
查看>>
jetty9请求form表单太小限制
查看>>
linux服务器优化1.0版
查看>>
从oracle到mysql,主从到分库,一个普通项目数据库架构的变迁
查看>>
ASP.NET 4.0请求验证报错 从客户端...中检测到有潜在危险的 Request.Form 值
查看>>