Redirection après chargement.

Bonjour a tous !

J'ai ce code, qui permet d'afficher une barre de chargement sur mon site :
<html>
<head>
<title>Barre de progression</title>
<style type="text/css">
body{
margin-left: auto;
margin-right: auto;
text-align:center;
}

.cadre{
border-radius: 10px 10px 10px 10px;
margin-top: 250px;
margin-left: auto;
margin-right: auto;
text-align:center;
height: 50px;
width: 900px;
border: 1px solid black;
}

#barre{
border-radius: 10px 10px 10px 10px;
height: 50px;
width: 0px;
background-color: #c00;
}
.texte{
text-align: center;
font-size: 26px;
font-weight: bold;
}
.chargement{
text-align: center;
font-size: 26px;
font-weight: bold;
position: absolute;
top: 30%;
left: 20%;
right: 20%;
}
</style>
<script type="text/javascript">
var i=0;
function progression(timer){
if(i<=parseInt(document.getElementById('cadre').clientWidth)){
var compteur=0;
document.getElementById("barre").style.width=i+"px";
while(compteur<=100)
compteur++;
if(i>40)
document.getElementById("pourcentage").innerHTML=parseInt(i/(parseInt(document.getElementById('cadre').clientWidth)/100))+"%";
setTimeout("progression();", timer);
i++;
}

}
</script>
</head>
<body onload="progression()">
<noscript class="cadre">Vous devez activer le Javascript pour pouvoir visiter ce site !</noscript>
<div class="chargement">
Chargement en cours ...
</div>
<div class="cadre" id="cadre">
<div id="barre">
<span class="texte" id="pourcentage"></span>
</div>

</div>
</body>
</html>

Se que je voudrais, c'est qu'une fois que la barre a fini de charger, elle ouvre l'accueuil du site, comment faire cela ?

Merci d'avance ! :D