Postback Freezes Animated Gifs
==============================
:author: Aaron Ball
:email: nullspoon@iohq.net



Hello again all,

<rant>In all my experiences in my life as a geek, I have found few things more
frustrating than developing something for any version of Internet Explorer
(please hold your shouts of agreement for the end). Internet Explorer 5 never
really existed (did the internet exist then even?), Internet Explorer 6 was a
complete atrocity, Internet Explorer 7 I am pretty sure caused the suicide rate
amongst us geeks to go up significantly, and Internet Explorer 8, while better
than its predecessors, only caused a few geeks to become severely dependent on
mind-altering drugs to help them cope with the frustrations of life (or maybe
just web development for IE).</rant>

You may now cheer...

Now, down to business. On the topic of Internet Explorer doing things
differently from the rest of the world simply for the sake of it (hey look,
they're taking after Apple), I have recently experienced a very frustrating
problem with animated gifs. Referring to my previous post about the file
uploader, the client I was developing that for wanted an animation icon for the
upload so their customers didn't think the page had frozen. Sounds like a
simple task, no?

*The problem can be described as this:* When a postback event occurs (ie:
clicking a link or submit button), Internet Explorer freezes all animated gifs
on the page.

*To explain how I fixed this,* I essentially placed an animated 'rotating
circle' on the page which was hidden until the onSubmit() function was called.
Here's the code for the image while it was hidden.

----
<img src="./images/loading.gif" id="loader" style="visibility:hidden;" />
----

Annnd here's the code for the animation problem fix as well as the code that
changes the image visibility.

----
function showLoader(){
   //*** Reload the image for IE ***
   document.getElementById('loader').src='./images/loader.gif';
   //*** Let's make the image visible ***
   document.getElementById('loader').style.visibility = 'visible';
}
----

Category:HTML
Category:Internet_Explorer
Category:Microsoft


// vim: set syntax=asciidoc: