jquery库实现iframe自适应内容高度和宽度
javascript原生和jquery库实现iframe自适应内容高度和宽度---推荐使用jQuery的代码!
<iframe src="index.php" id="mainiframe" name="mainiframe" width="100%" frameborder="0" scrolling="no" marginwidth="0" marginheight="0"></iframe>
基于Jquery库的代码很好实现:
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$("#mainframe").load(function(){
$(this).height(0); //用于每次刷新时控制IFRAME高度初始化
var height = $(this).contents().height() + 10;
$(this).height( height < 500 ? 500 : height );
});
});
</script>
基于JS原生代码的实现:
<script language="javascript">
if (window.parent.length>0){window.parent.document.all.mainframe.style.height=document.body.scrollHeight;}
</script>
只需在你被iframe调用的文件</body>之后加入上面这段即可!
这个也可以控制iframe的高度随内容的多而自动增长
<iframe name="web" width="100%" frameborder=0 height="100%" src="index.php" id="web" onload="this.height=web.document.body.scrollHeight+20" ></iframe>jquery库实现iframe自适应内容高度和宽度
jquery库实现iframe自适应内容高度和宽度的更多相关文章
- iframe 自适应内容高度
在使用iframe的时候,会出现iframe不能随着内容的高度自动改变的情况,下面就介绍一种可以自适应高度的办法.<br/> <pre> <iframe id=" ...
- JavaScript、jQuery获取页面及个元素高度、宽度
Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.client ...
- 两段超简单jquery代码解决iframe自适应高度问题(不用判断浏览器高度)
这里介绍两个超级简单的方法,不用写什么判断浏览器高度.宽度啥的.下面的两种方法自选其一就行了.一个是放在和iframe同页面的,一个是放在test.html页面的.注意别放错了地方.iframe的代码 ...
- iOS开发之解决WebView自适应内容高度
这段时间写的项目中,有涉及到根据后端上传的表单内容,然后在移动端将内容排版重新展示的功能点,所以小小的写一下解决办法. 首先如果直接进行内容展示,或者进行sizeToFit的操作,那么可能会造成图片超 ...
- js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码
获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下: document.body.offsetWidth doc ...
- jQuery - textarea 自适应内容高度
<textarea id="textarea"></textarea> <script> function makeExpandingArea( ...
- 完美方案——iOS的WebView自适应内容高度
/////////////////////////////初始化,self.view是父控件///////////////////////////////// _webView = [[UIWebVi ...
- jQuery获取页面及个元素高度、宽度【转】
获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 ...
- 通过代码创建label 计算最佳尺寸 让其自适应文本高度或宽度
通过xib创建label 让label随着文本内容的变化而动态改变尺寸比较简单 只要不固定死尺寸就可以了 但是通过代码创建的话我们需要给label设置一个frame 否则label默认是没有尺 ...
随机推荐
- 微信小程序 - 为何setData到页面上有的加分号
Page({ /** * 页面的初始数据 */ data: { }, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) { let _page = t ...
- taro 填坑之路(三)taro 缓存
1.taro 缓存 /** * 缓存数据 H5 小程序 * {food.id:{菜品信息 Num}, } */ import Taro from '@tarojs/taro'; // 取值 let s ...
- Linux环境下的make和makefile详解
无论是在Linux还是在Unix环境中,make都是一个非常重要的编译命令.不管是自己进行项目开发还是安装应用软件,我们都经常要用到make或make install.利用make工具,我们可以将大型 ...
- android系统特效详解和修改方法
安卓系统特效相关文件: 存在于:framework-res.apk 反编译后的\framework-res\res\anim文件夹内!anim文件夹下所有的文件都是特效文件原理 反编译fram ...
- Redis集群的安装测试(伪分布模式 - 主从复制)
想跑一下Redis集群,但是没有那么多服务器,所以使用伪分布式模式,模拟一下,记录一下安装过程. 软件: redis-3.0.3.tar.gz 集群正常工作至少需要3个主节点(本示例创建6个节点,3主 ...
- ztree获取选中节点
$(document).ready(function(){ $.fn.zTree.init($("#treeDemo"), setting, zNodes); }); functi ...
- C# 文件与路径操作
OpenFileDialog private void btnOpenFileDialog_Click(object sender, EventArgs e) { OpenFileDialog ope ...
- pandas set_index和reset_index的用法
1.set_index DataFrame可以通过set_index方法,可以设置单索引和复合索引. DataFrame.set_index(keys, drop=True, append=False ...
- appium 1.6.3 + ios 10.2 + xcode 8.2.1 真机运行iphone app
appium命令行启动: appium --address "127.0.0.1" --session-override --pre-launch --debug-log-spac ...
- 使用while循环和伪列的存储过程
使用while循环和伪列的存储过程如下: USE [JointFrame2] GO /****** Object: StoredProcedure [dbo].[Proc_enterprise_uni ...