javascript判斷flash檔案載入完畢程式碼例項

螞蟻小編發表於2017-03-27

本章節介紹一下如何利用js判斷js檔案是否載入完成,這個可能在實際應用中很少見,但絕非沒有,因為本人就曾經在實際編碼中遇到過類似的情況,也就是判斷當flash檔案載入完畢以後,再去執行指定的程式碼,下面就一個比較常見的案例做一下介紹。很多網站在首頁都會有flash廣告,但是flash是有一個載入過程的,當然有很多實現方式,有一種實現方式是這樣的,就是利用一個div來顯示flash載入的進度,如果當flash載入完畢,那麼就會顯示flash廣告,然後把AD層給隱藏掉,下面做一下分解:

一.定義進度條顯示層:

[HTML] 純文字檢視 複製程式碼
<div>  
  <span class="intro">下載進度:</span> 
  <div class="barborder"> 
    <div class="bar" id="loadpercent"></div> 
  </div> 
</div>

二.定義廣告層:

[HTML] 純文字檢視 複製程式碼
<div id="showAD"></div> 
定義FLASH顯示層: 
<div id="showSWF" class="show" style="display:none;"> 
<object id="flashgame" ......省略內容......> 
</object>

三.js程式碼:

[JavaScript] 純文字檢視 複製程式碼
//判斷是否為FIREFOX瀏覽器,FIREFOX不支援PercentLoaded()函式 
if(window.navigator.userAgent.indexOf("Firefox")>=1){ 
  document.getElementById("loadpercent").innerHTML="Firefox!No Attentions"; 
  document.getElementById("showSWF").style.display='block'; 
} 
else{ 
  refreshProgress(); 
} 
//隱藏AD層、顯示FLASH層 
function show(){ 
  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); 
  } 
}

相關文章