当前位置: 首页 > 编程日记 > 正文

如何实现iframe(嵌入式帧)的自适应高度

好几次看到有人提问问到如何实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象,刚好我在工作中也碰到了类似问题,于是上网翻查,东抄抄西看看,弄出来这么一个函数,贴到页面里面就能用了。不敢独享,大家要是觉得有用,欢迎使用

源代码如下

<script type="text/javascript">
 //** iframe自动适应页面 **//

//输入你希望根据页面高度自动调整高度的iframe的名称的列表
 //用逗号把每个iframe的ID分隔. 例如: ["myframe1", "myframe2"],可以只有一个窗体,则不用逗号。

//定义iframe的ID
 var iframeids=["test"]

//如果用户的浏览器不支持iframe是否将iframe隐藏 yes 表示隐藏,no表示不隐藏
 var iframehide="yes"

function dyniframesize()
 {
  var dyniframe=new Array()
  for (i=0; i<iframeids.length; i++)
  {
   if (document.getElementById)
   {
    //自动调整iframe高度
    dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);
    if (dyniframe[i] && !window.opera)
    {
     dyniframe[i].style.display="block"
     if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight) //如果用户的浏览器是NetScape
      dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;
     else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) //如果用户的浏览器是IE
      dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
    }
   }
   //根据设定的参数来处理不支持iframe的浏览器的显示问题
   if ((document.all || document.getElementById) && iframehide=="no")
   {
    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
    tempobj.style.display="block"
   }
  }
 }

if (window.addEventListener)
 window.addEventListener("load", dyniframesize, false)
 else if (window.attachEvent)
 window.attachEvent("onload", dyniframesize)
 else
 window.οnlοad=dyniframesize
</script>


使用的时候只要贴在<head></head>里面就可以了

相关文章:

拖拉机也将自动驾驶,日本劳动力短缺大力发展无人农业

来源 | HyperAI超神经责编 | 晋兆雨头图 | CSDN付费下载自视觉中国内容提要&#xff1a;为解决农业劳动力短缺问题&#xff0c;日本近年来涌现出自动收割机、插秧机等自动化农业设备。近日&#xff0c;其农机生产商久保田&#xff0c;也宣布与英伟达联手&#xff0c;将推出自动…

php字符串操作

1.字符串的格式化 按照从表单提交数据之后&#xff0c;php处理的不同&#xff1a;接受&#xff0c;显示&#xff0c;存储。也有三种类型的格式化方法。 1.1字符串的接收之后的整理: trim(),ltrim(),rtrim() 当数据从表单中上传上来的时候需要对字符串整理一下&#xff0c;去掉字…

javascript事件列表解说

javascript事件列表解说事件浏览器支持解说一般事件onclickIE3、N2 鼠标点击时触发此事件ondblclickIE4、N4 鼠标双击时触发此事件onmousedownIE4、N4 按下鼠标时触发此事件onmouseupIE4、N4 鼠标按下后松开鼠标时触发此事件onmouseoverIE3、N2 当鼠标移动到某对象范围的上方时…

Facebook如何预测广告点击:剖析经典论文GBDT+LR

作者 | 梁唐来源 | TechFlow今天我们来剖析一篇经典的论文&#xff1a;Practial Lessons from Predicting Clicks on Ads at Facebook。从这篇paper的名称当中我们可以看得出来&#xff0c;这篇paper的作者是Facebook的广告团队。这是一篇将GBDT与LR模型结合应用在广告点击率预…

centos lustre 简单 安装教程

Lustre是一个大规模的、安全可靠的&#xff0c;具备高可用性的集群文件系统&#xff0c;它是由SUN公司开发和维护的。 该项目主要的目的就是开发下一代的集群文件系统&#xff0c;可以支持超过10000个节点&#xff0c;数以PB的数据量存储系统。 因为业务需要&#xff0c;需要做…

安装flash

网校客服124说: 2017-03-11 18:37:39网校客服124说: 2017-03-11 18:37:48您好&#xff0c;您可以安装这个插件试一下http://www.chinaacc.com/downcenter/网校客服124说: 2017-03-11 18:38:04下载后安装时请关闭所有的浏览器。我说: 2017-03-11 18:40:08转载于:https://blo…

左右漂浮的广告代码

引用JS文件的代码&#xff1a; <script language"javascript" src"****.js"></script> <---- var delta0.15 var collection; function floaters() { this.items []; this.addItem function(id,x,y,content) { document.wri…

韩辉:国产操作系统的最大难题在于解决“生产关系”

作者 | 高卫华编辑 | Just出品 | AI科技大本营&#xff08;ID&#xff1a;rgznai100&#xff09;操作系统是所有软件体系的基础&#xff0c;而随着中国物联网产业的迅猛发展&#xff0c;诸多国产嵌入式操作系统开始跃出水面。其中之一包括 SylixOS&#xff0c;这是一款由国内企…

java中运用label跳转

2019独角兽企业重金招聘Python工程师标准>>> goto是java的保留词&#xff0c;但java里并没有goto. goto可以随心所欲地在代码里跳转&#xff0c;看似很方便&#xff0c;但带来的代码混乱成为其被人诟病的原因。 然而有些时候必要的goto可以带来很大的方便。所以jav…

【转】超简单利用UGUI制作圆形小地图

http://sanwen.net/a/ithhtbo.html 由于UI都是Achor自己用PS做的&#xff0c;比较粗糙&#xff0c;大家见谅&#xff0c;不过丝毫不影响功能的实现&#xff0c;下面我们看看今天的笔记&#xff1a; 首先我们看看需要哪些组件&#xff1a; 1.在Canvas画布下新建一个GameObject&a…

Jmail的主要参数列表

说明&#xff1a;更多的信息请参考Jmail说明&#xff0c;我想这已经足够用的了。 &#xff08;1&#xff09;Body&#xff08;信件正文&#xff09; : 字符串如&#xff1a;JMail.Body "这里可以是用户填写的表单内容&#xff0c;可以取自From。" &#xff08;2&…

VMware VSphere 虚拟化云计算学习配置笔记(一)

第一章&#xff1a;VMware和VSphere 简单介绍 在VMware发布的vSphere 5.0中&#xff0c;VMware淘汰了ESX&#xff0c;ESXi成为了唯一的hypervisor。在ESXi 5.0中&#xff0c;VMware提供了七大重要的增强功能&#xff0c;包括&#xff1a;镜像生成器&#xff08;Image Builder&a…

“国产操作系统最大难题在于解决「生产关系」” | 人物志

作者 | 高卫华来源 | CSDN&#xff08;ID&#xff1a;CSDNnews&#xff09;操作系统是所有软件体系的基础&#xff0c;而随着中国物联网产业的迅猛发展&#xff0c;诸多国产嵌入式操作系统开始跃出水面。其中之一包括 SylixOS&#xff0c;这是一款由国内企业翼辉信息自主设计开…

详解 Vue Vuex 实践

2019独角兽企业重金招聘Python工程师标准>>> 随着应用复杂度的增加&#xff0c;我们需要考虑如何进行应用的状态管理&#xff0c;将业务逻辑与界面交互相剥离&#xff0c;详细讨论参考笔者的2016-我的前端之路:工具化与工程化。Vue 为我们提供了方便的组件内状态管理…

可控制的页面内滚动区域

效果预览 下面我们就来详细讲解一下这种效果的制作方法&#xff1a; 首先&#xff0c;我们在样式表里加入“.opacity {FILTER: alpha(opacity100)”&#xff0c;看下面&#xff01; <style type"text/css"><!--.opacity {FILTER: alpha(opacity100)}-->&…

提升对ASP.NET网站性能和多并发的设计的讨论

对于如何提高应用程序的性能&#xff08;无论是互联网应用还是企业级应用&#xff09;我的观点一直是考虑一个核心&#xff1a;IO处理。因为我认为目前的CPU的处理能力已经是非常高了&#xff0c;正常编写的在内存中处理的代码没有太严重的问题都不会对CPU造成很大的影响&#…

算力至上?四大AI芯片大对决

来源 | 老石谈芯&#xff08;ID: laoshi_tanxin&#xff09;目前&#xff0c;全世界超过90%的数据都是在过去的两三年之内产生的。随着人工智能、自动驾驶、5G、云计算等各种技术的不断发展&#xff0c;海量数据都将会继续源源不断的产生。预计到2025年&#xff0c;数据总量将比…

JavaScript作用域原理——预编译

JavaScript是一种脚本语言, 它的执行过程, 是一种翻译执行的过程。并且JavaScript是有预编译过程的&#xff0c;在执行每一段脚本代码之前, 都会首先处理var关键字和function定义式&#xff08;函数定义式和函数表达式&#xff09;。 一、变量执行之前&#xff0c;会被赋为unde…

VC++实现QQ聊天工具【源代码】

http://down.51cto.com/data/53416转载于:https://blog.51cto.com/6297123/1094981

​炸了!程序员现在没有这点技能都还不能就业了?

数据正在变得越来越常见&#xff0c;小到我们每个人的社交网络、消费信息、运动轨迹……&#xff0c;大到企业的销售、运营数据&#xff0c;产品的生产数据&#xff0c;交通网络数据……如何从海量数据中获得别人看不见的知识&#xff0c;如何利用数据来武装营销工作、优化产品…

javascript表单之间的数据传递

今天有朋友问我关于用javascript来进行页面各表单之间的数据传递的问题&#xff0c;我以前也写过&#xff0c;不过从来没有注意&#xff0c;今天总结了一下&#xff0c;希望能够给大家一些帮助&#xff0c;也帮助我总结以前学过&#xff0c;用过的知识。 一&#xff0c;最简单的…

Vue从Hello World到打包(后端适读)

Vue从Hello World到上线 Vue 简介 Vue是个MVVM框架。 特点&#xff1a;简单易学、体积小、性能高。并且它的源码耦合性非常低&#xff0c;了解它的过程也就是思想进步的过程。 当然&#xff0c;只学这一个框架&#xff0c;无法完成前端的全部工作&#xff0c;除了Vue之外&#…

Android和iOS那个好?

Android和iOS那个好&#xff1f; 应该先往哪个上面投入资源&#xff1f; 多次被人问到此类问题&#xff0c;笔者刚好自己的项目也需要考虑iOS版本。就索性进行了一番调研&#xff0c;于是有了本文&#xff08;本次不讨论越狱的iOS&#xff09; 首先从情感上&#xff0c;你…

对话谢宝友:搞真正自研的国产操作系统,而不是伪创新

作者 | 郑丽媛责编 | 屠敏出品 | CSDN&#xff08;ID&#xff1a;CSDNnews&#xff09;从国外操作系统的长期垄断到中国自主研发操作系统数十年的起落浮沉&#xff0c;技术自主创新独立已成为国产基础软件的主要突破口。近几年间&#xff0c;随着物联网时代的到来&#xff0c;以…

ASP.NET 学习历程

[注意我不推荐高级技术的书&#xff0c;因为你如果是个高手了就可以自己选择甄别书了&#xff0c;此文只对初学者&#xff0c;因为他们此时没有辨别好快的能力&#xff0c;本人几乎买尽所有的.NET书&#xff0c;有好有坏。] 你所看的第一本书对你以后影响最重要&#xff01;&a…

http头部消息中的cache-control解释

网页的缓存是由HTTP消息头中的“Cache-control”来控制的&#xff0c;max-age&#xff1a;&#xff08;只接受 Age 值小于 max-age 值&#xff0c;并且没有过期的对象&#xff09;max-stale&#xff1a;&#xff08;可以接受过去的对象&#xff0c;但是过期时间必须小于 max-st…

iframe自动调整高度能在IE5里实现吗

偶已经理解到style"height:expression(main.document.body.scrollHeight)"只对第一次显示的内嵌网页有效&#xff0c;如果里面的内容更新必须把主页刷新一遍才能自动适应新的高度&#xff0c;那么惟一的解决办法就是点击链接后整个页面都刷新一次&#xff0c;如何写成…

SQL Server-流程控制 5,Goto 语句

ylbtech-SQL Server:SQL Server-流程控制 5,Goto 语句SQL Server 流程控制中的 Goto 语句。 1&#xff0c;Goto 语句1 --2 -- 1, Goto语句3 -- Desc:Goto语句可以让程序跳转到一个指定的标签处并执行其后的代码。Goto语句和标签可以在程序4 -- 、批处理和语句块中的任意位置使用…

MLPerf基准测试再发榜,浪潮AI服务器刷新18项纪录

近日&#xff0c;全球倍受瞩目的权威AI基准测试MLPerf公布今年的推理测试榜单&#xff0c;其中浪潮AI服务器NF5488A5一举创造18项性能纪录&#xff0c;在数据中心AI推理性能上遥遥领先其他厂商产品。 MLPerf是当前全球最具影响力的AI计算基准评测组织&#xff0c;由图灵奖得主大…

Web充斥着存在漏洞的过期JavaScript库

虽然使用第三方软件库通常会降低开发的时间&#xff0c;但同时也会增加网站暴露出的攻击表面&#xff0c;对此我们应有充分的认识。因此需要保持第三方软件库的最新版本依赖&#xff0c;以便从安全更新中获益。即便如此&#xff0c;一份近期研究表明&#xff0c;在Alexa排名前7…