Aqui fica uma resposta tardia pois a resposta aceite não explica qual o problema que tinha no seu código e acrescenta jQuery quando a solução não é necessáriamente essa.
Tem alguns problemas no seu código:
O primeiro é que CSS e JavaScript precisam de tags de HTML para o browser conseguir interpretar esse código como o que ele é e não HTML. Ou seja, em vez deste pedaço:
body{overflow-x:hidden;overflow-y:hidden;}
<div id="bloquear" style="position:absolute;top:0;left:0;width:100%;height:100%; background:#333;"></div>
function liberar(){
document.getElementById('bloquear').style.display='none';
document.body.style.overflow='scroll';
}
<body onload="liberar">
deve ter assim: (com o javascript dentro de tags <script>
)
<style>
body{overflow-x:hidden;overflow-y:hidden;}
</style>
<div id="bloquear" style="position:absolute;top:0;left:0;width:100%;height:100%; background:#333;"></div>
<script>
function liberar(){
document.getElementById('bloquear').style.display='none';
document.body.style.overflow='scroll';
}
</script>
<body onload="liberar">
Outro problema é que a declaração do inicio do body
ocerre depois de já ter aparecido HTML na página. Isto é inválido. A tag <body>
diz ao browser que alí começa o corpo da págna e não pode haver HTML fora do body. Assim esta linha:
<div id="bloquear" style="position:absolute;top:0;left:0;width:100%;height:100%; background:#333;"></div>
deve ser inserida depois da tag <body onload="liberar">
Outro problema é que a função liberar não vai ser corrida se não acrescentar ()
no fim. Ou seja <body onload="liberar()">
. Dê uma olhada aqui (http://jsfiddle.net/sFms7/) teste retirar os ()
e carregue em "Run", vai ver que a função não corre. Isto porque JavaScript dentro de HTML comporta-se de maneira diferente. Esse ponteiro para a função só vai ser lido/parsed quando o onload
fôr chamado.
O ultimo problema é o posicionamento da função liberar
. Aqui tem duas opções. Ou coloca dentro da tag <head>
(que falta no seu código) juntamente com o <style>
, ou então coloca no final do body
, exatamente antes de </body>
. Uma vez que é somente uma declaração de função é indiferente onde coloca, desde que tenha as tags de HTML correctas.
(teste retirar ()
a seguir a liberar para ver o código a falhar esconder a div)