IE image visibility bug

I found two very strange bugs in IE 8 yesterday (probably in other IE versions as well). I have an image and some text in a SPAN that is made visible with some JavaScript. Here is the HTML :

<img id="ctl00_ContentPlaceHolder1_Image3" src="Graphics/waiting.gif" align="middle" style="border-width:0px;visibility:hidden" />

<span id="ctl00_ContentPlaceHolder1_Label4" style="visibility:hidden">Please wait. Adding results to database.</span>

The Javascript attempts to change the visibility like this :

ctl00_ContentPlaceHolder1_Label4.style.visibility='visible';

ctl00_ContentPlaceHolder1_Image3.style.visibility='visible';

for SPAN tags this works. for IMG tags it has absolutely no effect!

The solution is a horrible hack :-

<script type="text/javascript">

function UploadComplete()

{

ctl00_ContentPlaceHolder1_Label4.style.visibility='visible';

document.all.ctl00_ContentPlaceHolder1_Image3.style.display='none';

document.all.ctl00_ContentPlaceHolder1_Image3.style.display='block';

document.all.ctl00_ContentPlaceHolder1_Image3.style.visibility='visible';

document.all.ctl00_ContentPlaceHolder1_Image3.src='waiting.gif';

window.setTimeout(TurnAnimatedGifBackOn, 500);

}

function TurnAnimatedGifBackOn ()

{

var tmp = document.all.ctl00_ContentPlaceHolder1_Image3;

if(typeof (tmp) == 'object')

{

tmp.style.visibility = 'visible'; tmp.src='waiting.gif';

}

}

</script>

To fix the problem the IMG tag has to have it’s display property toggled from ‘none’ and back to ‘block’.

The second bug is that animated gifs stop animating when a page post back occurs. To fix this problem I’ve used a timer to alter the image 500ms after the page post back. To get the animation working the src tag must be reloaded with the image url.

Other browsers do not seem to have this problem.