summaryrefslogtreecommitdiff
path: root/src/Postback_Freezes_Animated_Gifs.adoc
blob: 092d18115fdb0d6553a9512ba9d658c3a5f40b3f (plain)
    1 Postback Freezes Animated Gifs
    2 ==============================
    3 :author: Aaron Ball
    4 :email: nullspoon@iohq.net
    5 
    6 
    7 == {doctitle}
    8 
    9 Hello again all,
   10 
   11 <rant>In all my experiences in my life as a geek, I have found few things more
   12 frustrating than developing something for any version of Internet Explorer
   13 (please hold your shouts of agreement for the end). Internet Explorer 5 never
   14 really existed (did the internet exist then even?), Internet Explorer 6 was a
   15 complete atrocity, Internet Explorer 7 I am pretty sure caused the suicide rate
   16 amongst us geeks to go up significantly, and Internet Explorer 8, while better
   17 than its predecessors, only caused a few geeks to become severely dependent on
   18 mind-altering drugs to help them cope with the frustrations of life (or maybe
   19 just web development for IE).</rant>
   20 
   21 You may now cheer...
   22 
   23 Now, down to business. On the topic of Internet Explorer doing things
   24 differently from the rest of the world simply for the sake of it (hey look,
   25 they're taking after Apple), I have recently experienced a very frustrating
   26 problem with animated gifs. Referring to my previous post about the file
   27 uploader, the client I was developing that for wanted an animation icon for the
   28 upload so their customers didn't think the page had frozen. Sounds like a
   29 simple task, no?
   30 
   31 *The problem can be described as this:* When a postback event occurs (ie:
   32 clicking a link or submit button), Internet Explorer freezes all animated gifs
   33 on the page.
   34 
   35 *To explain how I fixed this,* I essentially placed an animated 'rotating
   36 circle' on the page which was hidden until the onSubmit() function was called.
   37 Here's the code for the image while it was hidden.
   38 
   39 ----
   40 <img src="./images/loading.gif" id="loader" style="visibility:hidden;" />
   41 ----
   42 
   43 Annnd here's the code for the animation problem fix as well as the code that
   44 changes the image visibility.
   45 
   46 ----
   47 function showLoader(){
   48    //*** Reload the image for IE ***
   49    document.getElementById('loader').src='./images/loader.gif';
   50    //*** Let's make the image visible ***
   51    document.getElementById('loader').style.visibility = 'visible';
   52 }
   53 ----
   54 
   55 Category:HTML
   56 Category:Internet_Explorer
   57 Category:Microsoft
   58 
   59 
   60 // vim: set syntax=asciidoc:

Generated by cgit