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自适应内容高度和宽度的更多相关文章

  1. iframe 自适应内容高度

    在使用iframe的时候,会出现iframe不能随着内容的高度自动改变的情况,下面就介绍一种可以自适应高度的办法.<br/> <pre> <iframe id=" ...

  2. JavaScript、jQuery获取页面及个元素高度、宽度

    Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.client ...

  3. 两段超简单jquery代码解决iframe自适应高度问题(不用判断浏览器高度)

    这里介绍两个超级简单的方法,不用写什么判断浏览器高度.宽度啥的.下面的两种方法自选其一就行了.一个是放在和iframe同页面的,一个是放在test.html页面的.注意别放错了地方.iframe的代码 ...

  4. iOS开发之解决WebView自适应内容高度

    这段时间写的项目中,有涉及到根据后端上传的表单内容,然后在移动端将内容排版重新展示的功能点,所以小小的写一下解决办法. 首先如果直接进行内容展示,或者进行sizeToFit的操作,那么可能会造成图片超 ...

  5. js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码

    获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下: document.body.offsetWidth doc ...

  6. jQuery - textarea 自适应内容高度

    <textarea id="textarea"></textarea> <script> function makeExpandingArea( ...

  7. 完美方案——iOS的WebView自适应内容高度

    /////////////////////////////初始化,self.view是父控件///////////////////////////////// _webView = [[UIWebVi ...

  8. jQuery获取页面及个元素高度、宽度【转】

    获取浏览器显示区域(可视区域)的高度 :    $(window).height();    获取浏览器显示区域(可视区域)的宽度 : $(window).width();    获取页面的文档高度 ...

  9. 通过代码创建label 计算最佳尺寸 让其自适应文本高度或宽度

    通过xib创建label  让label随着文本内容的变化而动态改变尺寸比较简单  只要不固定死尺寸就可以了  但是通过代码创建的话我们需要给label设置一个frame  否则label默认是没有尺 ...

随机推荐

  1. C#基础视频教程3.3 常见控件类型和使用方法

    前面介绍了微软的控件,也介绍了几个第三方控件,那么这些控件是如何做出来的?即便我们自己不做控件,也至少要理解控件的原理. 如果要创建一个自定义控件,首先新建一个C#下面的Windows窗体控件库   ...

  2. SQLServer 之 聚合函数

    一.聚合函数介绍 1.聚合函数最常用的: (1) COUNT:求个数 count函数用于计算满足条件的数据项数,返回int数据类型的值. [1] 语法结构:COUNT( {[[ all | disti ...

  3. Python 3 解析 html

    资料:https://docs.python.org/3/library/html.parser.html python 自带了一个类,叫 HTMLParser. 我们用的时候需要自己定义一个类,继承 ...

  4. Struts2之文件上传(单文件/多文件)

    <一>简述: Struts2的文件上传其实也是通过拦截器来实现的,只是该拦截器定义为默认拦截器了,所以不用自己去手工配置,<interceptor name="fileUp ...

  5. 隐函数画图with R

    隐函数画图 with R 这个函数 sin(xsiny)-cos(ycosx)=0 图是这个样子 怎么用R画出来呢?下面是代码 x<-y<-seq(-10,20,0.1) f<-fu ...

  6. OpenERP对象字段定义的详解

    OpenERP对象支持的字段类型有,基础类型:char, text, boolean, integer, float, date, time, datetime, binary:复杂类型:select ...

  7. Ruby 和 Python 分析器是如何工作的?

    你好! 我作为一名编写Ruby profiler的先驱,我想对现有的Ruby和Python profiler如何工作进行一次调查. 这也有助于回答很多人的问题:“你怎么写一个profiler?” 在这 ...

  8. 统计时间段内周分类SQL语句

    declare @datefrom as datetime,@dateto as datetime set @datefrom='2015-04-12' set @dateto='2015-08-13 ...

  9. Oracle GoldenGate (ogg) 11.2.1.0.20 是最后一个支持oracle db 10g的 ogg版本号

    參考原文: Oracle GoldenGate 11.2.1.0.22 Patch Set Availability (Doc ID 1669160.1) 该文章不做翻译,只摘录当中有价值的信息,例如 ...

  10. Apach 配置虚拟机时候DocumentRoot参数最后不要加斜杠

    DocumentRoot "D:\baiduyun\webroot\jedi\app\static" 这样是可以的 DocumentRoot "D:\baiduyun\w ...