JavaScript 实现 Flash 加载进度条与状态监控

HTML 结构定义

首先定义用于显示进度的进度条层：

 
<div><span class="intro">下载进度：</span>
<div class="barborder">
<div class="bar" id="loadpercent"></div>
</div>
</div>

接着定义广告展示层：

 
<div id="showAD"></div>
随后定义 Flash 内容的显示层：
<div id="showSWF" class="show" style="display:none;">
<object id="flashgame" ......省略内容......>
</object>
</div>

JavaScript 逻辑实现

接下来是核心的 JavaScript 逻辑代码：

<script language="javascript">
if(window.navigator.userAgent.indexOf("Firefox")>=1)//判断是否为FIREFOX浏览器，FIREFOX不支持PercentLoaded()函数
{ 
document.getElementById("loadpercent").innerHTML= "Firefox!No Attentions";
document.getElementById("showSWF").style.display='block';
} 
else
{ 
refreshProgress();
} 
function show()//隐藏AD层、显示FLASH层
{ 
document.getElementById("showAD").style.display='none';
document.getElementById("showSWF").style.display='block';
} 
function refreshProgress()//刷新进度条函数
{ 
var downProgressWidth=502;
var bar = document.getElementById("loadpercent");
var movie = document.getElementById("flashgame");
var nPercentLoaded = Math.abs(movie.PercentLoaded());
bar.style.width=Math.ceil(downProgressWidth*nPercentLoaded/100) +"px";
bar.innerHTML= nPercentLoaded +"%";
if(nPercentLoaded==100)
{ 
bar.style.width=(downProgressWidth-2) + "px"; bar.innerHTML= "Game download is complete"; show();
} 
else
{ 
setTimeout('refreshProgress()',0);
} 
}

实际上，参考主流 Flash 游戏网站的源码实现，是掌握此类控制技巧与知识的有效途径。