栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

动态的改变IFrame的高度实现IFrame自动伸展适应高度

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

动态的改变IFrame的高度实现IFrame自动伸展适应高度

动态的改变Iframe的高度,实现Iframe自动伸展,父页面也自动神缩
原理: 在Iframe子页面一加载的时候,调用父Iframe对象,改变其高度
具体实现一:
1、在Iframe的具体页面(就是子页面),添加Javascript
复制代码 代码如下:


2、在Iframe的具体页面(就是子页面)的body中,添加onload事件
复制代码 代码如下:


3、为父页面的Iframe标签添加ID,即上面第一步,方法体中的第2行所写到的childframe
复制代码 代码如下:


具体实现二:
复制代码 代码如下:
//动态改变父类iframe的高度
//iframe页面调用的js
$(function(){
//取到窗口的高度
var winH = $(window).height();
//取到页面的高度
var bodyH = $(document).height();
if(bodyH > winH){
window.parent.document.getElementById("mainframe").height=bodyH;
}else{
window.parent.document.getElementById("mainframe").height=winH;
}
});

父页面的iframe为
复制代码 代码如下:

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/112290.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号