iframe自适应高度

(2013-04-23 17:29:49)

标签：

iframe

高度

自适应

js

杂谈

 分类： 网页制作
有时候我们的网站需要引入其他网站的东西，比如评论，这时候就需要使用iframe,那么在不知道其高度的情况下如何使其能够自适应呢？下面用js代码实现。
<iframe id="iFrame1"  width="100%" src="链接地址" frameborder="0"  scrolling="no" onload="document.getElementByIdx_x_x('iFrame1').style.height = document.body.clientHeight+'px'; "></iframe>
最重要的就是这句：onload="document.getElementByIdx_x_x('iFrame1').style.height = document.body.clientHeight+'px';也可以直接用this.style.height=
不知道新浪博客总是在某些单词后面添加一些无用的（getElementByIdx_x应该去掉x_x），截图如下：

这样在不设置高度的情况下iframe也能够根据自身内容自适应了。

iframe自适应高度（转）的更多相关文章

  1. jquery 清空 iframe 的内容，，iframe自适应高度

    $(iframe).contents().find("body").html(""); iframe自适应高度 $("#AllDescription& ...

  2. 真正的让iframe自适应高度 兼容多种浏览器随着窗口大小改变

    今天有朋友问到我关于"iframe自适应高度"的问题,原本以为是很简单的问题,没想到折腾了20分钟才搞定.期间遇到几个问题,要么是高度自适应了,但是当窗口改变时会出现滚动条.也就是 ...

  3. jquery iframe自适应高度[转]

      经典代码 iFrame 自适应高度,在IE6/IE7/IE8/Firefox/Opera/Chrome/Safari通过测试. 很古老的方法: <iframe src="../In ...

  4. js实现iframe自适应高度

    转自:http://www.jb51.net/article/15780.htm 对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的! 不带边框的iframe因为能 ...

  5. 网页制作技巧:iframe自适应高度

    转自:http://www.enet.com.cn/article/2012/0620/A20120620126237.shtml 通过Google搜索iframe 自适应高度,结果5W多条,搜索if ...

  6. Iframe 自适应高度的方法！

    第一种方法:代码简单,兼容性还可以,大家可以先测试下. function SetWinHeight(obj) { var win=obj; if (document.getElementById) { ...

  7. iframe自适应高度的多种方法小结

    转自:http://www.jb51.net/article/15780.htm 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的大小 ...

  8. iframe自适应高度的多种方法方法小结

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的  不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 ifram ...

  9. [转载]再谈iframe自适应高度

    Demo页面:主页面 iframe_a.html ,被包含页面 iframe_b.htm 和 iframe_c.html 下面开始讲: 通过Google搜索iframe 自适应高度,结果5W多条,搜索 ...

  10. iframe自适应高度的多种方法方法小结（转）

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的 ...

随机推荐

  1. html5 frameset5内嵌框架集

    利用html5 frameset内嵌框架简单做一个网页,网页的布局大体如下: 我们可以将其分为四个部分: 第一部分:top图片栏 第二部分:left链接栏 第三部分:right内容栏 第四部分:网页整 ...

  2. [Gym-101512C] 凸包+最远点对

    找最大的四边形或者三角形面积,先求凸包,然后枚举两个点,再通过旋转,找最大的另两个点 #include<bits/stdc++.h> #define fi first #define se ...

  3. ICE的连接机制

    1.当使用ICE的proxy进行方法调用时,ICE运行环境会建立一个到服务器的连接.当proxy提供了多个endpoint时   默认的ICE运行环境选择endpoint的行为为random,可以通过 ...

  4. windows下mysql提示Can't connect to MySQL server on 'localhost'

    1.开cmd输入mysqld --defaults-file="c:\Program Files (x86)\MySQL\MySQL Server 5.6\my-default.ini&qu ...

  5. Spark入门实战系列

    转自:http://www.cnblogs.com/shishanyuan/p/4699644.html 这一两年Spark技术很火,自己也凑热闹,反复的试验.研究,有痛苦万分也有欣喜若狂,抽空把这些 ...

  6. Unity3d-WWW实现图片资源显示以及保存和本地加载

    本文固定连接:http://blog.csdn.net/u013108312/article/details/52712844 WWW实现图片资源显示以及保存和本地加载 using UnityEngi ...

  7. Win7服务器搭建实例教程：教你Win7如何搭建Web服务器【转载】

    原文地址:http://www.pc841.com/article/20140607-30534.html 局域网Web服务器的主要功能是实现资源共享,同时借助于局域网服务器访问页面可有效的实现信息的 ...

  8. python之 前端HTML/CSS基础知识学习笔记

    1. 文件结构: HTML文件的固定结构: <html> <head>...</head> <body>...</body> </ht ...

  9. Python collections系列之有序字典

    有序字典(orderedDict ) orderdDict是对字典类型的补充,他记住了字典元素添加的顺序 1.创建一个有序字典 import collections dic = collections ...

  10. try catch(java)

    1 try.catch.finally语句中,在如果try语句有return语句,则返回的之后当前try中变量此时对应的值,此后对变量做任何的修改,都不影响try中return的返回值 2 如果fin ...