Browser: Continue gif animation after escape is pressed

Posted by cottsak on Stack Overflow See other posts from Stack Overflow or by cottsak
Published on 2010-05-26T10:25:46Z Indexed on 2010/05/26 12:01 UTC
Read the original article Hit count: 310

Filed under:
|
|
|
|

Firefox (and other browsers i believe) stop gif animation when you click the Stop button or invoke it via the Escape key.

I have a text input that on change makes ajax requests to update other elements. As part of this ajaxyness i have an animated gif to show feedback.
I also trap the escape key press in this input so as to clear the text field for better UX.

My problem is after the escape key is pressed once, none of the ajax gifs animate anymore until the page is refreshed. Does anyone know a workaround?


Stuff i've tried:

I tried the e.stopPropagation(); and e.cancelBubble = true; in the function handling the e.keyCode == 27 and that didn't seem to work. I suspect that this stops trigging more js events and the browser catches the escape irrespective of js activity.

I have the gif showing/hiding via adding/removing a css class so it's difficult to apply the "change gif url to reset" workaround. I dont even know if this works anyway - didn't test it. But it seems difficult. If anyone knows that this works and knows of an easy way to apply the hack with background-image: url(../images/ajax-loader_dotcirclel13x13.gif); css then please let me know.

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about AJAX