网页中的Flash有时由于体积比较大,导致加载慢,加载过程中只出现白色底,影响用户体验,为了解决这个问题,我们可以先把Flash隐藏掉,先显示一张图片,等Flash加载完成后再显示Flash
js实现方法:用轮询判断Flash加载进度PercentLoaded(),当返回值为100时即为Flash加载完成;
function isFlashLoaded(id){
var flashBox = document.getElementById(id);
var imgs = $(flashBox).find("img");
var flash = null;
//定时器轮询
flashBox.timer = setInterval(function(){
//获取object,在定时器外获取可能获取不到,所以现在每次查询都会获取一次
flash = flashBox.getElementsByTagName("object")[0];
//如果获取到的Flash为空,则返回
if(!flash) return;
flash.isLoaded = Math.floor(flash.PercentLoaded()) == 100
//如果Flash加载为100%,清除定时器,运行callback函数,显示Flash
if(flash.isLoaded){
clearInterval(flashBox.timer);
callback();
}
},1000)
function callback(){
flash.style.opacity="1";
}
}
我一开始的做法,判断flash的固有函数IsPlaying类型是否是function,如果是则证明Flash加载完成,可惜Ie不行。
flash.isLoaded = (typeof flash.IsPlaying == "function")?true:false;