iframe高度自适应
怎样使得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>