Paul Irish

So it turns out that if you set up a loading spinner like this:

<div id="spinner" style="display: none"><img src="loading.gif"/>Loading...</div>

And then show the div, the animated gif will not animate in… which browser? IE6, of course.

Solutions:

Refresh the innerHTML content (This is stupid but it works..):

document.getElementById('spinner').style.display = '';  // show it, and then...
document.getElementById('spinner').innerHTML = document.getElementById('spinner').innerHTML;

OR
Set the animated gif as the div’s css background image instead of using the child IMG element. Perhaps:

#spinner { 
  background: url(loading.gif) no-repeat 5px 3px; 
  padding-left: 20px; }

The second solution is a little classier and is also better from a semantic POV, IMHO.

Paul Irish front-end development