Animated GIFs, submitting and IE
Surprise, surprise, it didn’t work. IE simply refused to animate the GIF when the form was submitted. I googled and googled with no avail – until I ran into a simple and working solution. I won’t present the non-working ones here, they can be found with any relevant keywords.
The working one is the following in its entirety: Use a div to display the indicator as a background image. In addition to toggling display, also toggle visibilty.
- First, in the function called from the onload event of body I hide the outer div:
document.getElementById('Indicator').style.display = 'none'; document.getElementById('Indicator').style.visibility = 'hidden';
- Then, in the function called from the onsubmit event of the button input in the form, I show the outer div and set the background image for the inner one:
document.getElementById('Indicator').style.display = 'block'; document.getElementById('Indicator').style.visibility = 'visible'; document.getElementById('image').style.backgroundImage = 'url(indicator.gif)';
That’s all. This has been tested in IE7, but it might also work in IE6.
Edit: I made it clearer that the animation must be a background image and it needs to be set in onsubmit.