JS: Progress Bar

Hi there !

I need help with my progress bar
I found some script (progress bar script) on internet and I dont know how to modify the script correctly
Please help me

I want to modify this script, it must start when the site is completely loaded.

Here is the script:

CSS:

<style type="text/css">

div.statusbar { width:300px; height:25px; border:1px outset silver; background:url('http://pabi3.com/storage/progress-bar-cez-javascript-a-css/bar-empty.png') repeat-x; float: left; }
div.statusbar div#status { width:300px; height:25px; color:black; font-weight:bold; top:0; left:0; position:absolute; text-align:center; padding:6px; }
div.statusbar div#bar    { width:0%; height:100%; background:url('http://pabi3.com/storage/progress-bar-cez-javascript-a-css/bar.png') repeat-x; text-align:center; }
        </style>


JS:

<script type="text/javascript">		
function status(sb_start,sb_end,seconds)
{
	var speed = Math.round(seconds*30);
	var timer = 0;
	for(i = sb_start; i <= sb_end; i++)
	{
		setTimeout("process('" + i + "')",(timer*speed));
		timer++;
	}
}

function process(status)
{
	var progress = document.getElementById('status');
	progress.innerHTML = status + '%';

	var bar = document.getElementById('bar');
	bar.style.width = status + '%';

	if(status == 100) {
progress.innerHTML = 'Completed';
}


}
status(0,100,10);
</script>


HTML:

<div class='statusbar'>
<div id='bar'></div>
<div id='status'>0%</div>
</div>

Code (markup):

Please help. Thanks