Quizás sea porque tienes un espacio de más en la línea:
document.getElementById('tope').style.visibility=' hidden';} (entre la primera ' y hidden)
debe ser así:
Código HTML:
document.getElementById('tope').style.visibility='hidden';}
Esta prueba funciona perfectamente en iexplorer, en firefox y en opera, la prueba tiene metida la página de un periódico porque suelen pesar mucho y tardan un poco en terminar de cargarse y se puede ver bien el efecto de la capa de precarga:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Capa de precarga de página</title>
<style type="text/css">
#tope {
position:absolute;
color: black;
background-color: #C0C0C0;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 1000;
text-align: center;
visibility: visible;
}
html {
overflow: hidden;
margin: 0;
}
body {
overflow: hidden;
margin: 0;
}
.envolvente {
border: solid 1px #CCCCCC;
overflow: auto;
}
.aviso {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
text-align: center;
}
</style>
<script type="text/javascript">
//---
function loaded () {
document.getElementById('tope').style.visibility='hidden';}
//---
</script>
</head>
<body onLoad="loaded()">
<div id="tope">
<span id="centrada" style="position:absolute; width: 240px; height: 40px; margin-left: -120px; margin-top: -20px; z-index:1; left: 50%; top: 50%" class="aviso">Espere mientras se carga la página...</span>
</div>
<div id="wrapper" style="width: 100%; height: 100%;" align="center">
<iframe id="exterior" src="http://www.elmundo.es" height="500" width="700" class="envolvente"></iframe>
</div>
</body>
</html>