1、

<a href="port" target="frame_view">港口资料</a>

<iframe id="external-frame" onload="setIframeHeight(this)"  src="initialValue"  frameborder="0" scrolling='no' height="100%"  width="100%" name="frame_view" ></iframe>

使用target可以多个页面调用

2、使之自适应屏幕大小

//iframe自适应高度
function setIframeHeight(iframe) {
if(iframe) {
var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
if(iframeWin.document.body) {
iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight;
}
}
};

window.onload = function() {
setIframeHeight(document.getElementById('external-frame'));
};

关于iframe的使用 以及自适应页面高度的更多相关文章

  1. iframe动态改变内嵌页面高度

    test.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://w ...

  2. 【转】jquery iframe取得元素与自适应高度

    今天没事来总结一下iframe在jquery中怎么操作的,下面我来给各位介绍jquery 获取iframe子/父页面的元素及iframe在jquery高度自适应实现方法,各位朋友可参考. jquery ...

  3. jquery iframe取得元素与自适应高度

    总结一下iframe在jquery中怎么操作的,下面我来给各位介绍jquery 获取iframe子/父页面的元素及iframe在jquery高度自适应实现方法,各位朋友可参考. jquery方法: 在 ...

  4. html页面高度自适应

    本文实现的效果是依据浏览器分辨率的不同.页面底端背景色自适应浏览器高度,也就是能够自己主动填充背景色. <script type="text/javascript"> ...

  5. 获取Iframe页面高度并赋值给Iframe以及获取iframe里的元素

    最近接手了别人的项目,别人用到了iframe,自己在实战中总结了一些关于iframe的小问题. 获取Iframe页面高度并赋值给Iframe Html <iframe name="co ...

  6. swiper 不同页面高度自适应

    在使用swiper写页面滑动时发现不同页面高度无法自适应,使用autoHeight:true也不起作用 研究了一下发现可以这样设置 .swiper-slide{ overflow: hidden; } ...

  7. jquery库实现iframe自适应内容高度和宽度

    javascript原生和jquery库实现iframe自适应内容高度和宽度---推荐使用jQuery的代码! ‍<iframe src="index.php" id=&qu ...

  8. 设置iframe高度自适应屏幕高度

    写在前面: 最近在搭建项目前台页面框子的时候,把iframe设置成了固定的高度,导致不同的电脑尺寸访问的时候,高度差异较大,故查了下,将iframe设置成自动适应屏幕高度的方式,这里记录下. 还是直接 ...

  9. js自适应屏幕高度

    //自适应屏幕高度 $(window).resize(function() { hightChange(); }); function hightChange(){ ; $();// iframe i ...

随机推荐

  1. LeetCode2.两数相加 JavaScript

    给定两个非空链表来表示两个非负整数.位数按照逆序方式存储,它们的每个节点只存储单个数字.将两数相加返回一个新的链表. 你可以假设除了数字 0 之外,这两个数字都不会以零开头. 示例: 输入:(2 -& ...

  2. React Router 4 的使用(2)

    Route Rendering Props 对于给定的路由如何渲染组件,有三种选项:component.render.children.你可以查看 <Route> 的文档来获取更多的信息, ...

  3. vue源码解读1

    前言 vue是一个非常典型的MVVM框架,它的核心功能一是双向数据绑定系统,二是组件化开发系统.那么本文是以一种通俗易懂的的角度来实现一个简单 的双向数据绑定系统,如果你用过vue却对vue的实现原理 ...

  4. 关于echarts整合多个类似option

    最近项目里面遇到一些图表需要用echarts来做.而我之前只用过一次echarts,也只是做了一个简单的饼状图,并没有涉及到很多的配置.但是现在这个项目,这些图表需要自己配置很多东西.像什么多余的网格 ...

  5. <CPP学习>第一天 第一个CPP程序 hello word

    由于我是计算机类嵌入式专业的大一学生,之前一直使用的是生万物的C语言,了解了其过程性语言的特性及其基础语法,在大一下学期期末阶段想自学一下C++,其实在开学初就买了一本C++ Primer,但由于各种 ...

  6. SAP ABAP 日期,时间 相关函数

    获的两个日期之间的分钟数 data min TYPE i. CALL FUNCTION 'DELTA_TIME_DAY_HOUR' EXPORTING T1 = ' T2 = ' D1 = ' D2 ...

  7. MySQL高可用之MGR安装测试(续)

      Preface       I've implemented the Group Replication with three servers yesterday,What a shame it ...

  8. loushang框架的开发中关于BSP的使用,将写好的功能模块部署到主页界面结构上

    前言: 当我们已经开发好相应的模块或者功能的时候,需要将这个功能部署在index主页上作为可点击直接使用的模块,而不是每次需要去浏览对应的url地址. 这时候就需要运用到L5的BSP. 作为刚刚入门l ...

  9. 如何本地搭建centos7虚拟主机?

    1 前期准备: 下载虚拟机和CentOS安装源 VMware-workstation-full-10.0.3-1895310 CentOS-7.0-1406-x86_64-DVD.iso   以下是过 ...

  10. mysql 常用函数,基本使用

    1:选中排除表1 连接表2 表3 获取选中表1中部分选中表3 的部分 并且设置选中状态select t1.*,if(t2中t3id=t1.id,1,0)as checked from t1 lefet ...