Pues sí que es curioso el tema, sí. Sólo he conseguido que parezca que funcione si retraso la funcion con un setTimeout:
Código PHP:
<div id="pensando" style="width:400px; visibility:hidden;">Estoy pensando</div>
<input type="button" value="crea y ordena" onclick="perifollo()" />
<script>
function proc() {
var arr=new Array();
for(var a=0;a<=5000;a++)
arr[a]=Math.random()*100;
arr.sort();
}
function perifollo() {
//alert("Comienzo perifollo, capa oculta");
document.getElementById("pensando").style.visibility="visible";
//alert("Debería estar visible, comienzo proc()");
setTimeout("proc()",1);
//alert("Debería estar visible, proc() terminado");
setTimeout(' document.getElementById("pensando").style.visibility="hidden" ', 1);
//alert("Fin de perifollo, capa oculta");
}
</script>
Sin los setTimeout no hay manera, incluso creando el setTimeout sólo para proc(). Si ponemos un alert sí que funciona, pero pierde la gracia.
Si la mostramos con perifollo() y la ocultamos en proc() también funciona:
Código PHP:
<div id="pensando" style="width:400px; visibility:hidden;">Estoy pensando</div>
<input type="button" value="crea y ordena" onclick="perifollo()" />
<script>
function proc() {
var arr=new Array();
for(var a=0;a<=5000;a++)
arr[a]=Math.random()*100;
arr.sort();
//debo meterlo en otra función que esté retardada
document.getElementById("pensando").style.visibility="hidden"
}
function perifollo() {
document.getElementById("pensando").style.visibility="visible";
setTimeout("proc()",1);
}
</script>
eso sí, la función proc() tiene que estar retardada también, si no no funciona.
Es probable que se trate de una optimización en el trabajo interno de javascript, no lo sé, pero no deja de ser molesto...
He probado bastantes cosas, incluso hacer una función aparte para cambiar el estado de la capa, y ni con esas.
Si la función proc() y la orden de hacerlo hidden no están retardados (los dos) no he encontrado manera de hacerlo.
Las pruebas las he realizado en FF2, pero en IE auguro el mismo resultado...
Un saludo.