Ciao,
quello che tu desideri ottenere viene comunemente definito con il termine di ProgressBar, ovvero un indicatore dello stato di compimento di una determinata operazione.
Non capisco bene la critca che hai mosso allo script che riporti come esempio, ad ogni modo una possibile soluzione potrebbe essere la seguente:
<html>
<head>
<style>
.pb {
top: 0px;
left: 0px;
width: 0%;
background-color: yellow;
border-color: red;
border-width: 1px;
border-style: solid;
text-align: center;
}
BODY {
padding: 10px;
}
</style>
</head>
<body onLoad="startProgressBar();">
<div id="pb" class="pb"></div>
</body>
<script>
var perc = 0;
function startProgressBar()
{
perc += 2;
pb.style.width = perc + "%";
pb.innerText = perc + "%";
if( perc < 100 ) {
setTimeout( "startProgressBar();",100 );
}
}
</script>
</html>
Ciao ciao