日期:2014-05-20  浏览次数:20402 次

▲▲▲没有解决的iframe自适应高度问题,请大家看看。
现页面上有三个iframe   ,一个控制顶部,一个控制左边,一个控制右边。
如下:
<table     cellSpacing= "0 "   cellPadding= "0 "   width= "920 "   align= "center "   border= "0 "
  style= "border-right:   #cccccc   1px   solid;   border-top:   #cccccc   1px   solid;   border-left:   #cccccc   1px   solid;   border-bottom:   #cccccc   1px   solid; ">
<tr>
<td   height= "190 "   style= "   BORDER-BOTTOM:   #009900   1px   solid "> <iframe   src= "top.aspx "   frameBorder= "0 "   width= "100% "   scrolling= "no "     height= "190 "> </iframe>
</td>
</tr>
<tr   >
<td     >
<TABLE   id= "Table1 "     cellSpacing= "0 "   cellPadding= "0 "   width= "100% "   align= "center "   border= "0 "   height= "100% "   >
<TR>
<td   width= "20% "     > <iframe       id= "left "   src= "admin_left.aspx "     frameBorder= "0 "   width= "100% "     height= "980 "   scrolling= "no "     >   </iframe>
</td>
<TD   width= "80% "   > <iframe   id= "main "   name= "main "       src= "admin_main.aspx "       frameBorder= "0 "   width= "100% "     height= "980 "   scrolling= "no "     >   </iframe>
</TD>
</TR>
</TABLE>
</td>
</tr>
<tr>
<td   height= "100 "   style= "   BORDER-top:   #009900   1px   solid ">
<iframe   src= "../foot.aspx "   frameBorder= "0 "   width= "100% "     scrolling= "no "   height= "100 "> </iframe>
</td>
</tr>
</table>
问题是:当点击左边的菜单时,如何让左边的iframe和右边的iframe的高度随新打开的页面的高度变化面变化。   我用梅花雪的方法能实现右边iframe的高度随之变化,但左边iframe菜单确自动下移,多出来很多空白。

------解决方案--------------------
原来是要联动啊

我直接给你看我针对类似问题的脚本源码吧

// frameId是自己,frameOtherId是边上那个,frameTopId是顶层的frame(如果存在这个嵌套的话)
function SetFrameHeight(height, frameId, frameOtherId, frameTopId)
{
if (top == parent) return;

var frame = parent.document.getElementById(frameId);
if (frame == null) return;

var frameTop = top.document.getElementById(frameTopId);
var frameOther = parent.document.getElementById(frameOtherId);
if (frameTop != null && frameOther != null)
{
var windowContent = frameOther.contentWindow;
var bodyHeight = 0;

if (windowContent != null && windowContent.document.body.scrollHeight)
{ //ie5+ syntax
bodyHeight = windowContent.document.body.scrollHeight;
}
else if (frameOther.contentDocument && frameOther.contentDocument.body.offsetHeight)
{ //ns6 syntax
frameTop.style.display = "block ";
bodyHeight = frameOther.contentDocument.body.offsetHeight + FFextraHeight;