iframe高度自适应

转载于 2012-04-05 14:24:00 发布 · 57 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/phpcode/archive/2012/04/05/2522736.html

怎样使得iframe自适应嵌套的页面的高度？

在嵌入的页面的onload事件中调用如下代码：

parent.document.all(self.name).height=document.body.scrollHeight;

禁止网页缓存,设置expires=0.在主页及嵌入页中加入如下内容：

<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="0">

主页面内容：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0014)about:internet -->
<html>
<head>
<title>ifame自动高度</title>
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="0">
<meta http-equiv="Content-Type" content="text/html;">
</head>
<body bgcolor="#ffffff" leftmargin="0" topmargin="0" >

<table id="tab1" border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>　</td>
<td>　</td>
<td>　</td>
</tr>
<tr>
<td>　</td>
<td><iframe name="ifm" src="embed.htm" width="100%" frameborder="0" marginheight="0" marginwidth="0" hspace="0" vspace="0"></iframe></td>
<td>　</td>
</tr>
<tr>
<td>　</td>
<td>　</td>
<td>　</td>
</tr>
</table>

</body>
</html>

嵌入页面embed.htm内容：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0014)about:internet -->
<HTML>
<HEAD>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Expires content=0>
<META http-equiv=Cache-Control content=no-cache>
<META http-equiv=Pragma content=no-cache>
<script language="javascript">
function setparentheight(){
   parent.document.all(self.name).height=document.body.scrollHeight;
}
</script>
</HEAD>
<BODY onload="setparentheight();">
<TABLE name="tab1" class=center cellSpacing=0 cellPadding=0 width="100%">
   <tr><td>　</td><td>1</td><td>　</td></tr>
   <tr><td>　</td><td>2</td><td>　</td></tr>
   <tr><td>　</td><td>3</td><td>　</td></tr>
   <tr><td>　</td><td>4</td><td>　</td></tr>
   <tr><td>　</td><td>5</td><td>　</td></tr>
   <tr><td>　</td><td>6</td><td>　</td></tr>
   <tr><td>　</td><td>7</td><td>　</td></tr>
   <tr><td>　</td><td>8</td><td>　</td></tr>
   <tr><td>　</td><td>9</td><td>　</td></tr>
</TABLE>
</BODY>
</HTML>

转载于:https://www.cnblogs.com/phpcode/archive/2012/04/05/2522736.html