You can make use of setTimeout to achieve this effect: var src = '' Instead, what you need to do is to make sure jQuery sets the src after display:block is applied. So you are effectively trying to set the src when the element is still not visible according to Chrome, and Chrome won't do anything about it when the original src and new src are the same. Instead, Chrome queues the application of the new style for execution after evaluating the current chunk of JavaScript whereas other browsers would apply the new style change immediately.attr(), however, does not get queued. show() with no argument, the element is not actually shown immediately right where you call it. You may change the GIF in the fiddles for a more appropriate/longer animation gif for testing)Ĭhrome deals with style changes differently than other browsers. So my question is, is there a proper way to reset a GIF image's animation (which avoids Chrome's display:none "bug") or is it actually a bug? The main reason (context) of this question is that I wanted to reset an ajax loader GIF right before fading it in the page. css()ing the opacity, height and visibility when necessary to simulate a display:none behaviour. The only workaround which I've found so far is keeping the image with its default display and manipulating it through. fadeIn() right before setting the src doesn't work either. Changing the display of the image through.html('') and putting the image back inside of it, doesn't work either. Putting an wrapper around the image, emptying the container through.Setting the src to an empty string and restoring it to the default, doesn't work either.Setting the src to itself as in Fiddle, doesn't work in Chrome.The GIF resets fine on IE and Firefox before being displayed in the page, but Chrome simply refuses to reset its animation!
The issue which I have is when the image has display:none on Google Chrome only.Ĭheck this JSFiddle. The GIF resets perfectly fine on IE, Firefox and Chrome. Take a look at this JSFiddle for reference. All of the examples I've seen so far either simply set the src of the image to itself or set it to an empty string followed by the original src again. Hopefully I'm not the first one to have noticed this (apparently) bug on Webkit/Chrome. Title is self-explanatory, but I'll provide a step-by-step view on the matter.
0 kommentar(er)
