javascript实现框架高度随内容改变的方法
更新时间：2015年07月23日 15:10:28 作者：李荣飞
这篇文章主要介绍了javascript实现框架高度随内容改变的方法,实例分析了通过父页面及内容改变框架高度两种实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了javascript实现框架高度随内容改变的方法。分享给大家供大家参考。具体如下：
有两种方法：
一、就是通过父页面改变
这里要理解框架的两个属性 contentWindow 和contentDocument 两个属性的意思和window document意思差不多，不同的是contentWindow 所有浏览器都支持，contentDocument ie6,7不支持，chrome 也不支持
<iframe onload="change_height()"></iframe>
function change_height(){
var iframe=document.getElementById("iframe_id");
//取得框架元素
var i_height=iframe.contentWindow.document.body.scrollHeight||iframe.contentWindow.document.documentElement.scrollHeight;
//取得框架内容的高度
iframe.height=i_height;
//改变
}
二、就是通过内容改变
在内容页进行
window.onload=function(){
var iframe=parent.document.getElementById("iframe_id");
//取得框架元素
iframe.height=document.body.scrollHeight||document.documentElement.scrollHeight;
//取得框架内容的高度并改变
}
希望本文所述对大家的javascript程序设计有所帮助。
相关文章
给指定元素的后面追加一些自己想要实现的效果或者是一些属性之类的，有木有遇到过，接下来为大家详细介绍下追加的实现代码，感兴趣的朋友可以参考下哈2013-04-04
汉字转拼音,比较娱乐的一款应用，感兴趣的朋友可以了解下，或许对你学习js有所帮助2013-02-02
网站可用性是任何网站的基本要素，而可用的导航更是网站所必需的要素之一。导航决定了用户如何与网站进行交互。如果没有了可用的导航，那么网站内容就会变得毫无用处。2011-09-09
这篇文章主要介绍了基于JavaScript实现单例模式,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-10-10
这篇文章主要介绍了JS中的防抖与节流及作用详解，本文通过文字说明加示例代码的形式给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2021-10-10
这篇文章主要介绍了js实现简单的可切换选项卡效果的方法,涉及javascript操作css样式实现切换选项卡的技巧,非常具有实用价值,需要的朋友可以参考下2015-04-04
这篇文章主要介绍了JavaScript获取对象在页面中位置坐标的方法,涉及JavaScript操作页面元素属性的相关技巧,需要的朋友可以参考下2016-02-02
这篇文章主要为大家详细介绍了js基于myFocus实现轮播图效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
在许多现代网站中，有大量的JavaScript,事实上，JavaScript的下载和解析都需要时间，这使得网站的加载速度大大降低,有一些简单的方法可以减少你在网站上加载的JavaScript数量，并使你正在加载的JavaScript加载得更快，我们今天将介绍这些方法2023-06-06
这篇文章主要介绍了微信小程序保持session会话的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-03-03
最新评论