Does anyone know a work around to make animated GIF's continue to be animated after you click a link or submit a form on the page your on in IE? This works fine in other browsers.
Thanks.
16 Answers
The accepted solution did not work for me.
After some more research I came across this workaround, and it actually does work.
Here is the gist of it:
function showProgress() {
var pb = document.getElementById("progressBar");
pb.innerHTML = '<img src="./progress-bar.gif" width="200" height ="40"/>';
pb.style.display = '';
}
and in your html:
<input type="submit" value="Submit" onclick="showProgress()" />
<div id="progressBar" style="display: none;">
<img src="./progress-bar.gif" width="200" height ="40"/>
</div>
So when the form is submitted, the <img/> tag is inserted, and for some reason it is not affected by the ie animation issues.
Tested in Firefox, ie6, ie7 and ie8.
IE assumes that the clicking of a link heralds a new navigation where the current page contents will be replaced. As part of the process for perparing for that it halts the code that animates the GIFs. I doubt there is anything you can do about it (unless you aren't actually navigating in which case use return false in the onclick event).
Very, very late to answer this one, but I've just discovered that using a background-image that is encoded as a base64 URI in the CSS, rather than held as a separate image, continues to animate in IE8.
Related