使Iframe的宽高自适应，并且兼容IE 和NC浏览器- -

使用Iframe时，高和宽是直接定制好的。很难自适应引用的页面。这时就要用别的方法来进行了。以下整理了2种方法。以做备用：

1，适应内容自动扩展，在parent页面上加处理script：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language=JavaScript>
function autoResize(){
   try{
    document.all["content"].style.height=content.document.body.scrollHeight;
document.all["content"].style.width=content.document.body.scrollWidth;
   }
   catch(e){}
}
</script>

2.在引用的文件上加script

function changeIframeHeight() //自动改变 Iframe 的高度
{
if(top != self)
window.parent.document.getElementById(self.name).height = document.body.scrollHeight;
}

function window.onload()
{
changeIframeHeight(); //改变 Iframe 高度
}

把上面那个放到需要自适应的页面中，用javascript套用就可以了

第2种方法很好。而且速度够快，第1种方法虽然也能达到效果，不过速度可真是太慢了。

使Iframe的宽高自适应，并且兼容IE 和NC浏览器- -相关推荐

从零开始学习前端开发 — 7、CSS宽高自适应
一.宽度自适应语法:width:100%; 注: a)块状元素的默认宽度为100% b) 当给元素设置宽度为100%时,继承父元素的宽度 c) 通常使用宽度自适应实现通栏效果二.高度自适应语法: ...
PC端宽高自适应问题
宽高自适应网页布局中经常要定义元素的宽和高.但很多时候我们希望元素的大小能够根据窗口或子元素自动调整,这就是pc自适应. 自适应的优点:元素自适应在网页布局中非常重要,它能够使网页显示更灵活,可以适 ...
图片适应窗口_HTMLCSS学习笔记（八）-- 宽高自适应
宽高自适应网页布局中经常要定义元素的宽和高.但很多时候我们希望元素的大小能够根据窗口或子元素自动调整,这就是pc自适应. 自适应的优点: 元素自适应在网页布局中非常重要,它能够使网页显示更灵活,可以 ...
CSS学习笔记八——宽高自适应
宽高自适应一.宽度自适应二.高度自适应三.浮动元素的高度自适应四.窗口自适应五.结语一.宽度自适应不写宽度或者写 width:auto就表示宽度自适应,可用于横栏或导航栏. 与 widt ...
宽高自适应_css样式写出三角形，宽高自适应的正方形，扇形！
闲来无事练习一下常见的css样式,希望大家能指点一二! 1用css实现一个三角形!原理用border属性 <!DOCTYPE html> <html> <head> ...
css 百分比怎么固定正方形_css样式写出三角形，宽高自适应的正方形，扇形！...
闲来无事练习一下常见的css样式,希望大家能指点一二! 1用css实现一个三角形!原理用border属性 <! 实现它的原理那就要弄明白border属性, border是一个复合属性 borde ...
通过宽高自适应设计两栏布局和三栏布局
1.两栏布局我们要实现下面这样一个东西:两栏,左边一栏,右边一栏,左边宽高固定,右边宽高自适应,见下图: ✍我们有两种解决办法:(1)给右边盒子加外边距(2)calc函数的运用第一种方法:(1)给 ...
css控制图片拉伸不变形,css+background实现图片宽高自适应，拉伸裁剪不变形
图片宽高不固定 ,一样实现自适应,拉伸裁剪不变形,适应各大兼容性. 下面咱们在网上找两张宽高不一样的照片: No.1 ...
【CSS笔记】CSS设置元素堆叠顺序、元素宽高自适应、calc数学函数
目录一.堆叠顺序 1.1.默认堆叠顺序 1.2.设置堆叠顺序二.宽高自适应
宽高自适应下的导航栏文本居中
导航栏是网页中必不可少的一部分,固定的宽高可以直接写给元素,但是不同的分辨率之下,可能会出现滚动条或者空白,所以就需要使用宽高自适应的方式,让导航栏更加灵活的适应网页. 例: 导航栏宽1000px ...

使Iframe的宽高自适应，并且兼容IE 和NC浏览器- -

使Iframe的宽高自适应，并且兼容IE 和NC浏览器- -相关推荐

最新文章

热门文章