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. 开发工具--Eclipse使用及常见问题解决

    怎么查询Eclipse版本号: 方法一: 方法二: Eclipse安装目录下面找到readme文件夹,里边有个网页打开就可以看到当前版本; Eclipse汉化改为英文: Eclipse Mybatis ...

  2. ETO的公开赛T5《猎杀蓝色空间号》题解

    这道题别看题面这么长,其实题意很简单 就是让你求从起点开始的最长合法区间 合法的要求有两个:兜圈子和直飞 且这两个条件相互独立 (也就是说兜圈子的末尾不会对下面可能出现的直飞造成影响) 举个例子: 1 ...

  3. 【模板】素数测试(Miller-Rabin测试)

    基础素数测试模板 对于大数的素性判断,目前Miller-Rabin算法应用最广泛.一般底数仍然是随机选取,但当待测数不太大时,选择测试底数就有一些技巧了.比如,如果 被测数小于4759123141,那 ...

  4. Django模板简介

    在settings.py中有个TEMPLATES的设置,其中BACKEND用来配置Django模板引擎, DIRS 定义了一个目录列表,模板引擎按列表顺序搜索这些目录以查找模板源文件 一般我们都会把模 ...

  5. CentOS7版本基础使用

    第1章 CentOS7的使用 1.1 为什么要使用CentOS7版本 CentOS7是在CentOS6基础上发布的新版本,与之前的版本相比,主要的更新包括: 1.内核更新到3.10.0 2.支持Lin ...

  6. js 判断两个时间相差的天数

    judgeDay(sDate1, sDate2) { const sDate1 = `${new Date(sDate1).getFullYear()}-${new Date(sDate1).getM ...

  7. nginx2goaccess.sh脚本内容

    脚本github地址:https://github.com/stockrt/nginx2goaccess/blob/master/nginx2goaccess.sh 脚本内容: #!/bin/bash ...

  8. 处理laravel表单提交默认将空值转为null的问题

    比如表单提交,如果我们提交了这个字段,但是这个字段为空字符串.在Laravel中会自动转义成Null. 处理这个问题,直到找到中间件\vendor\laravel\framework\src\Illu ...

  9. is和==,编码补充

    一,is和==的区别: 1, 通过一个ID()可以查看到一个变量表示的值在内存中的地址.    s = 'alex' print(id(s)) # 4326667072 s = "alex& ...

  10. Android面试收集录 网络与加密

    1.创建Socket对象需要至少指定哪些信息? IP(或域名)和端口号 Socket socket=new Socket("www.baidu.com",80); 2.如何使用So ...