iframe宽高自适应
iframe子页面结尾添加本script
iframe子页面结尾添加本script <script type="text/javascript">
function iframeAuto() {
try {
if (window != parent) {
//定位需要调整的frame框架(在父级窗口中查找)
var a = parent.document.getElementsByTagName("iframe");
for (var i = 0; i < a.length; i++) {
if (a[i].contentWindow == window) {
var h1 = 0, h2 = 0;
a[i].parentNode.style.height = a[i].offsetHeight + "px";
a[i].style.height = "10px"; //首先设置高度为10px,后面会修改
if (document.documentElement && document.documentElement.scrollHeight) {
h1 = document.documentElement.scrollHeight;
}
if (document.body) h2 = document.body.scrollHeight;
var h = Math.max(h1, h2); //取两者中的较大值
if (document.all) { h += 4; }
if (window.opera) { h += 1; }
//调整框架的大小
a[i].style.height = a[i].parentNode.style.height = h + "px";
}
}
}
}
catch (ex) { }
}
//事件绑定的方法,支持IE5以上版本
if (window.attachEvent) {
window.attachEvent("onload", iframeAuto);
}
else if (window.addEventListener) {
window.addEventListener('load', iframeAuto, false);
}
</script>
iframe宽高自适应的更多相关文章
- 从零开始学习前端开发 — 7、CSS宽高自适应
一.宽度自适应 语法:width:100%; 注: a)块状元素的默认宽度为100% b) 当给元素设置宽度为100%时,继承父元素的宽度 c) 通常使用宽度自适应实现通栏效果 二.高度自适应 语法: ...
- JQuery iframe宽高度自适应浏览器窗口大小的解决方法
iframe宽高度自适应浏览器窗口大小的解决方法 by:授客 QQ:1033553122 1. 测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com ...
- jquery操作html中图片宽高自适应
在网站制作中如果后台上传的图片不做宽高限制,在前台显示的时候,经常会出现图片变形,实用下面方法可以让图片根据宽高自适应,不论是长图片或者高图片都可以完美显示. $("#myTab0_Cont ...
- css 宽高自适应的div 元素 如何居中 垂直居中
在我们 编写css 样式的时候经常会遇见一个问题 那就是一个 宽高未知的元素 要让他 垂直居中如何实现这个呢 下面是我常用的两种方法 上代码 下面的是 结构代码 <div class=" ...
- 翻屏类 h5 适配方案:解决宽高自适应难题
表格 图片等 宽度自适应 :width:100%; box-sizing: border-box; 基于淘宝适配方案flexible + 翻屏h5 适配方案adaptive flexible解读及 ...
- css+background实现 图片宽高自适应,拉伸裁剪不变形
图片宽高不固定 ,一样实现自适应,拉伸裁剪不变形,适应各大兼容性. 下面咱们在网上找两张宽高不一样的照片: No.1 ...
- HTML5 图片宽高自适应,居中裁剪不失真
一,使用 JS,先上效果图,右图为定死宽高的效果,左图为处理之后的 1, 主要思路是,在图片 onload 后,将图片的宽高比和 div 容器的宽高比进行比较, 2, 从而确定拉伸或者压缩之后是宽还是 ...
- 【CSS】三栏/两栏宽高自适应布局大全
页面布局 注意方案多样性.各自原理.各自优缺点.如果不定高呢.兼容性如何 三栏自适应布局,左右两侧300px,中间宽度自适应 (1) 给出5种方案 方案一: float (左右浮动,中间不用给宽,设置 ...
- iframe宽高百分百显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- JS Radio结合TEXT
<script> function fun_a(value){ if(value === "on"){ document.getElementById('a').dis ...
- Spring Event事件驱动
Spring事件驱动模型,简单来说类似于Message-Queue消息队列中的Pub/Sub发布/订阅模式,也类似于Java设计模式中的观察者模式. 自定义事件 Spring的事件接口位于org.sp ...
- py 二级习题(加密与解密)
题目: 1.比如说,我想 “我喜欢月月” 这句话加密即:将字符串中的每个字符的unicode值全都向后移动三位,即unicode 值加3,然后输出. 2.将按照上述规则加密的文字解密即:将字符 ...
- Milestone
为什么开博客? 事情要从一只蝙蝠说起... 准备用博客做什么? 记录自己在开发中遇到的issue以及解决的思路:记录一些读书笔记以便温故:练习如何制造仪式感,ect. ...
- Codeforces Round #622 (Div. 2) C2 - Skyscrapers (hard version) 单调栈
从左往右扫,找到比第i个小的第一个数字,l[i] = l[last] + (i - last) * m[i],用单调栈O(n)维护这个过程,再从右往左扫,同理可以算出r数组,注意一下long long ...
- Goland 2019下载和安装(带破解补丁和汉化包)
Goland 简介 Goland 是由 JetBrains 公司开发的一个新的商业 IDE,旨在为 Go 开发者提供的一个符合人体工程学的新的商业 IDE.Goland 整合了 IntelliJ 平台 ...
- vue.js事件传值之子组件传向父组件以及$emit的使用
在项目开发中,有时候会遇到一种需求比如是:在子组件中,通过一个事件,比如点击事件,去改变父组件中的某个值,下面来看看是怎么个流程 还是先截图目录结构 父组件为app.vue,components中的文 ...
- 重新机兵回归(MMR)
重新机兵回归记录 S/L法 Save / Load 法 . 在关键战斗前,先save一把 , 在结算奖励后如果奖励不好 , 再重新load再来过 . 比如说拿红牡丹等 . 还可以在逃跑时用此法 . 随 ...
- psp 周计划2
日期\时间 开始时间 结束时间 中断时间 净时间 活动 备注 12/3 9:00 11:30 10:30 120分钟 自习,练习 教室 14:00 16:30 15:30 80分钟 练习 中午休息 1 ...
- Redis 数据总结(1 数据导入)
理论基础部分:http://www.redis.cn/topics/mass-insert.html 几百上千万的数据建议使用pipe来完成导入. 1.windows 下数据导入命令: type ou ...