As far as I can tell this only affects IE 8.
Using the following code, the gif appears but is not animated (stuck in one position):
$("#<%=assessmentListLinkClientID() %>").click(function(){
$("#assessmentListLoaderImg").show();
});
I've also used .css('display', 'block')
with the same results.
Is there an accepted way (perhaps better than this) that produces reliable cross-browser results for showing an animated gif?
It appears this is the way to solve this issue:
<div id='myHiddeDiv' style='display:none'>
<img src='' id='myAnimatedImage'>
</div>
<input type='button' value='show image' onclick='showDiv();'>
<script languag='javascript'>
function showDiv()
{
document.getElementById('myHiddeDiv').style.display ="";
document.getElementById('myAnimatedImage').src = "http://www.nowhere.com/animatedGif.gif";
}
</script>
You need to re-set the src of the image tag, this forces IE to render it again and hence show it animated.