概述
最简单的一种方法
重要提示:src=中你必须填写的网页地址,一定要和本页面在同一个站点上,否则,会抱错,说“拒绝访问!”
之前自己也碰到过这个问题,为了得到答案去网上搜索,发现有不少人也遇到了这样的问题,现在就把解决方法共享一下
超简单哦
1、建立一个bottom.js的文件,然后输入下面的代码(只有两行哦)
parent.document.all("框架ID名").style.height=document.body.scrollHeight;
parent.document.all("框架ID名").style.width=document.body.scrollWidth;
这里的 框架ID名 就是Iframe的ID,比如:
<IFRAME id="框架ID名" name="left" frameBorder=0 scrolling=no src="XXX.asp" width="100%"></IFRAME>
2、给你网站里所有的被包含文件里面每个都加入
<script language = "JavaScript" src = "bottom.js"/></script>
3、OK,收工!
我在WINXP、IE6下面测试通过。很简单吧!
之前自己也碰到过这个问题,为了得到答案去网上搜索,发现有不少人也遇到了这样的问题,现在就把解决方法共享一下
超简单哦
1、建立一个bottom.js的文件,然后输入下面的代码(只有两行哦)
parent.document.all("框架ID名").style.height=document.body.scrollHeight;
parent.document.all("框架ID名").style.width=document.body.scrollWidth;
这里的 框架ID名 就是Iframe的ID,比如:
<IFRAME id="框架ID名" name="left" frameBorder=0 scrolling=no src="XXX.asp" width="100%"></IFRAME>
2、给你网站里所有的被包含文件里面每个都加入
<script language = "JavaScript" src = "bottom.js"/></script>
3、OK,收工!
我在WINXP、IE6下面测试通过。很简单吧!
复杂的方法
main.htm
<
html
>
< head >
< meta http-equiv ='Content-Type' content ='text/html; charset =gb2312' />
< meta name ='author' content ='F.R.Huang(meizz梅花雪)//www.meizz.com' />
< title > iframe自适应加载的页面高度 </ title >
</ head >
< body >
< iframe src ="child.htm" ></ iframe >
</ body >
</ html >
< head >
< meta http-equiv ='Content-Type' content ='text/html; charset =gb2312' />
< meta name ='author' content ='F.R.Huang(meizz梅花雪)//www.meizz.com' />
< title > iframe自适应加载的页面高度 </ title >
</ head >
< body >
< iframe src ="child.htm" ></ iframe >
</ body >
</ html >
child.htm
<
html
>
< head >
< meta http-equiv ='Content-Type' content ='text/html; charset =gb2312' />
< meta name ='author' content ='F.R.Huang(meizz梅花雪)//www.meizz.com' />
< title > iframe 自适应其加载的网页(多浏览器兼容) </ title >
< script type ="text/javascript" >
<!--
function iframeAutoFit()
{
var ex;
try
{
if(window!=parent)
{
var a = parent.document.getElementsByTagName("IFRAME");
for(var i=0; i<a.length; i++) //author:meizz
{
if(a[i].contentWindow==window)
{
var h1=0, h2=0;
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 = h +"px";
}
}
}
}
catch (ex){}
}
if(document.attachEvent)
{
window.attachEvent("onload", iframeAutoFit);
window.attachEvent("onresize", iframeAutoFit);
}
else
{
window.addEventListener('load', iframeAutoFit, false);
window.addEventListener('resize', iframeAutoFit, false);
}
//-->
</ script >
</ head >
< body >
< table border ="1" width ="200" style ="height: 400px; background-color: yellow" >
< tr >
< td > iframe 自适应其加载的网页(多浏览器兼容,支持XHTML) </ td >
</ tr >
</ table >
</ body >
</ html >
< head >
< meta http-equiv ='Content-Type' content ='text/html; charset =gb2312' />
< meta name ='author' content ='F.R.Huang(meizz梅花雪)//www.meizz.com' />
< title > iframe 自适应其加载的网页(多浏览器兼容) </ title >
< script type ="text/javascript" >
<!--
function iframeAutoFit()
{
var ex;
try
{
if(window!=parent)
{
var a = parent.document.getElementsByTagName("IFRAME");
for(var i=0; i<a.length; i++) //author:meizz
{
if(a[i].contentWindow==window)
{
var h1=0, h2=0;
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 = h +"px";
}
}
}
}
catch (ex){}
}
if(document.attachEvent)
{
window.attachEvent("onload", iframeAutoFit);
window.attachEvent("onresize", iframeAutoFit);
}
else
{
window.addEventListener('load', iframeAutoFit, false);
window.addEventListener('resize', iframeAutoFit, false);
}
//-->
</ script >
</ head >
< body >
< table border ="1" width ="200" style ="height: 400px; background-color: yellow" >
< tr >
< td > iframe 自适应其加载的网页(多浏览器兼容,支持XHTML) </ td >
</ tr >
</ table >
</ body >
</ html >
最后
以上就是淡然御姐为你收集整理的Iframe自适应其加载的内容高度的全部内容,希望文章能够帮你解决Iframe自适应其加载的内容高度所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复