082009
 

因为FireFox和IE的高度计算方式不同,所以导致了SWFObject嵌入SWF文件时的某些问题。

这两天就遇到了奇怪的问题,在嵌入SWF的时候将高度设置为100%的时候,IE显示正常,FF下愣是不显示,搜索了一下发现官网的第一条就是关于这个问题的(SWFObject Wiki FAQ)。官网的建议是这样的:

<style type="text/css" media="screen">
      html, body, #containera, #containerb { height:100%; }
      body { margin:0; padding:0; overflow:hidden; }
    </style>

不过这种灵活性比较低。我现在遇到的情况是这样的,布局分三块:

第一块:头部和导航栏

第二块:主内容

第三块:底部

第一块和底部的高度的确定的,分别为120px和80px。主内容块的高度为整个可视区域减去120px+80px;

因此就需要对SWFObject推荐的嵌入代码作如下修改:

<script type="text/javascript">
        var flashvars = {};
        var params = {
            menu: "false",
            scale: "noScale",
            bgcolor: "#FFFFFF"
        };
        window.onresize = function() { 
            document.getElementById("altContent").height = document.body.clientHeight – 160;
        }
        swfobject.embedSWF("AlbumManager.swf", "altContent", "100%", document.body.clientHeight – 160, "9.0.0", "expressInstall.swf", flashvars, params);
    </script>

也就是说使用JavaScript模拟了“100% ”。