This is a simplified example, to make sure that there are no asynchronous fading/animation functions involved.
I want, that the background is red when the function with the heavy workload works and turns to black, when it is ready. What actually happens is, that most times the background will turn directly to black, after the function is ready. Yo will not see a red background, even if you are waiting for 'done' be alerted.
Is there a better solution, then wating a few milliseconds with setTimeout, so that the background change to red happens. To call work() directly produces the problem.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Test</title>
<script type='text/javascript'>
function work()
{
var i, a;
a = [];
for(i = 0; i < 250000; i++)
{
a.push(Math.random());
}
a.sort();
document.getElementsByTagName('body')[0].style.background = '#000000';
alert('done');
return true;
}
window.onload = function() {
document.getElementsByTagName('body')[0].style.background = '#ff0000';
//work();
setTimeout(work, 100);
};
</script>
</head>
<body>
<h1>Test</h1>
</body>
</html>