Why wont my loading image display in chrome (Webkit)?

[wee493]

On my site I have a span with a loading image in it. By default it's hidden, but every 10 seconds my page is set to check with the server for changes. The image displays perfectly in Firefox, but not in chrome/safari (I guess it's a problem with webkit). I am using the ajax from the pinned beginners ajax guide, I've used it many times before as I'm a noobie with ajax and I have not gotten around to learning it yet, just hacking it together.

 

You can see my site here... http://wee493.com/lastfm/homepage/index.php?user=josho493

(I'm using the last.fm api to get a users info, feel free to plug in your last.fm username if if you have one  )

 

I made a few modifications to his code, I added this....

// handle the httprequest
MyHttpRequest.onreadystatechange = function ()
{
if(MyHttpRequest.readyState == 4) // done and responded
{
document.getElementById(target_div).innerHTML = MyHttpRequest.responseText; // display result
document.getElementById('recent-loading').style.display = 'none'; // Hides loading image

}
else
{
document.getElementById('recent-loading').style.display = 'inline'; // Shows loading image
//document.getElementById(target_div).innerHTML = MyHttpLoading; // Commented out so the data is still displayed while loading
}
}
MyHttpRequest.send(null);
}
else 
{
document.getElementById(target_div).innerHTML = ErrorMSG; // the browser was unable to create a httprequest
}
}

 

Thanks for any help, It's greatly appreciated.

[ixicoding]

I checked your page on both safari and firefox. On firefox the loading image displays correctly, but on safari it wasn't as nice. It did work, however. If you notice it is displaying but just very quickly. It may be that webkit is more efficient?