Animated GIF not animated in Internet Explorer
Issue: In order to show the user that the system is working during an AJAX call I use an animated gif. A problem arose in Internet Explorer 8 that when I submitted the form the animated gif would stop and freeze. This issue does not come up with any other browsers. I looked for various solutions and some people mentioned resetting the img src in javascript or to use some time of setTimeout, but none of those methods worked for me.
Here is the line of code that ultlimately worked:
document.getElementById('ajax_spinner').parentNode.style.display = 'block';
The only reasoning that I was able to find from the original poster was that it somehow established a connection with the parent node. In this case, I put a div tag around the image and set the style to display:none, so this line of code actually modifies the div which encapsulates the image. The image style does not control the visibility or display of itself.
*Update*
Additional I have found that putting this code in the onclick of a submit button does not work. I had to replace the submit button with a standard button and submit the form via javascript.
jQuery(“#my_form_name”).submit();
