奇怪的问题，关于js+css实现页面内容高度自适应的两种解决方案

本站blog板块 的css.css样式表中，我用以下CSS的语法成功实现了IE/火狐 两种浏览器的内嵌页面，随着页面内容多少自适应问题：

 

淘宝网精品女装
淘宝网女士服装
淘宝网女士内衣
淘宝网入口 (健身减肥产品，汽车装饰，男人装，数码玩意...应有尽有)
淘宝网入口官方网站

 

#tag {width:950px;height:auto!important; min-height:388px; height:auto;overflow:hidden;margin:0 auto;}
#header {width:950px;height:40px;margin:0 auto;}
#page {width:950px;height:auto!important; min-height:388px; height:auto;overflow:hidden;margin:0 auto;background:#ffffff;}
#left{width:295px;height:auto!important; min-height:388px; height:auto;overflow:hidden;float:left;background:url(images/1_10.gif);}
#right{width:655px;height:auto!important; min-height:388px; height:auto;overflow:hidden;margin:0px 0px 0px 0px;float:left;background:#ffffff;}

淘宝网精品女装
淘宝网女士服装
淘宝网女士内衣
淘宝网入口 (健身减肥产品，汽车装饰，男人装，数码玩意...应有尽有)
淘宝网入口官方网站

然而，在本站主页面的main.css中，用了类似以上的CSS语法:height:auto!important;min-height:388px;height:auto;overflow:hidden

却无法实现高度自适应。

 

淘宝网精品女装
淘宝网女士服装
淘宝网女士内衣
淘宝网入口 (健身减肥产品，汽车装饰，男人装，数码玩意...应有尽有)
淘宝网入口官方网站

不得已，用JS的方式实现了高度自适应问题，这样以后我要修改页面内容，则只需要修改item_xxx.html内嵌页面，而不需要像以前一样，去修改JS中的document.writeln中的height参数。

确实方便多了，但有个弊端，这样给网站服务器增加了负载（因为JS要计算内嵌iframe页面的高度），而且，网速不够快的用户，很容易被卡到页面，把当前页面显示为一个空白。

不明白，为什么两种方法实现的效果不一样。

 

下面共享一下本人用JS实现内嵌页面高度自适应功能的代码：
<!--
function AutoHeight(fm_name,fm_id){
     var frm=document.getElementById(fm_id);
     var subWeb=document.frames?document.frames[fm_name].document:frm.contentDocument;
     if (frm != null && subWeb != null){
        frm.style.height = subWeb.documentElement.scrollHeight+ "px" ;
//如需自适应宽高，去除下行的“//”注释即可
//      frm.style.width = subWeb.documentElement.scrollWidth+"px";
     }
}

淘宝网精品女装
淘宝网女士服装
淘宝网女士内衣
淘宝网入口 (健身减肥产品，汽车装饰，男人装，数码玩意...应有尽有)
淘宝网入口官方网站

//-->
document.writeln("<iframe onLoad =/"{AutoHeight('FM_Name','FM_Id');}/" ");
document.writeln("src =/"../item_forU.html/" ");
document.writeln("name =/"FM_Name/" id =/"FM_Id/" width =/"950/" marginwidth =/"0/" marginheight =/"0/" ");
document.writeln("frameborder =/"0/" scrolling =/"no/"><//iframe>")

（PS：做人要厚道，转载请注明出处：http://www.3netgo.com/blog ）