The progress bar in IE works fine but when run in the Firefox it hides behind the map. How can I make the behavior same for FireFox as in IE? Is there a way to make the map layer not the active layer so that the progress bar can display above it?
I truly appreciate your help.
Here is the code snippet for the Progress Bar -
<div id="divProgressBar" class="divRemoveProgressBar" > <div id="divLoadingBox" class="divLoadingBox" style="background-image: url(images/Loading_Screen.png); background-repeat:no-repeat;" ><div style="background-image: url(images/ProgressBar.gif); background-repeat:no-repeat;" class="divLoadingGif" ></div></div> </div>
Css Class -
.divDisplayProgressBar {
filter:alpha(opacity=75);-moz-opacity:.75;
opacity:.75;
background-color: #c0c0c0;
position: absolute; z-index:1;
top: 0px; left: 0px; width: 100%; height: 1100px;
display: block;
}
.divRemoveProgressBar
{
display: none;
}
JavaScript:
/*
Routine to remove modal progress bar
*/
function RemoveProgressBar() {
var ProgressBar = document.getElementById("divProgressBar");
if (ProgressBar) {
ProgressBar.className = "divRemoveProgressBar";
}
}
/*
Routine to display modal progress bar
*/
function DisplayProgressBar() {
//Force remove Progress bar after one minute
window.setTimeout("RemoveProgressBar();", "15000");
var ProgressBar = document.getElementById("divProgressBar");
if (ProgressBar) {
ProgressBar.className ="divDisplayProgressBar";
}
}