First, define the progress bar display layer:
Copy codeThe Code is as follows:
<Div> <span class = "intro"> download progress: </span>
<Div class = "barborder">
<Div class = "bar" id = "loadpercent"> </div>
</Div>
</Div>
Define the ad layer:
Copy codeThe Code is as follows:
<Div id = "showAD"> </div>
Define the FLASH display layer:
<Div id = "showSWF" class = "show" style = "display: none;">
<Object id = "flashgame" ...... content omitted ......>
</Object>
</Div>
Js Code:
Copy codeThe Code is as follows:
<Script language = "javascript">
If (window. navigator. userAgent. indexOf ("Firefox")> = 1) // determines whether the browser is FIREFOX. FIREFOX does not support the PercentLoaded () function
{
Document. getElementById ("loadpercent"). innerHTML = "Firefox! No Attentions ";
Document. getElementById ("showSWF"). style. display = 'block ';
}
Else
{
RefreshProgress ();
}
Function show () // hide the AD layer and display the FLASH Layer
{
Document. getElementById ("showAD"). style. display = 'none ';
Document. getElementById ("showSWF"). style. display = 'block ';
}
Function refreshProgress () // refresh progress bar function
{
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 );
}
}
In fact, the best code is to look at some flash game websites and how to control them. By looking at the source code, you can learn more about the knowledge and skills.