Firefox 4.0: Improper handling of Animated Gif background-image

FF 4.0 is giving erratic and incorrect displays of an animated gif on a project I am working on. I have prepared a very small sample that demonstrates the problem.
The problem occurs when an animated gif is used as the background-image for a div (it may also be true when used as a background-image for the body, but I have not tested that).
When a page is first loaded, the animated gif displays properly.
I would expect that the animation be displayed as animated either:
# On each page load
# On a page load with new session or when the image is removed from cache prior to loading the page. Otherwise the last frame of the image would show
The sample page is designed to test this.
IE: Behaved as in #1, i.e. the image was animated on each and every page load. (IE 8: 8.0.6001....)
Google Chrome: Behaved as in #2, i.e. the image is animated only when there is a new session or when the image is no longer in cache. (Version 10.0.648.204)
FF 3.6.8: Slightly strange, but acceptable.
* The image is animated on new session and on any reload button.
* The last frame is displayed if the location is reentered in the URL bar.
* The last frame is displayed if the back/forward navigation buttons are used.
* SOMETIMES the image is animated and sometimes the last frame is displayed when the change page button is pressed (i.e. Javascript change page).
FF 4.0: Just plain NOT acceptable
* Correctly animates the image on page load for new session
* Correctly animates the image on reload button following clearing the image from cache.
* INCORRECTLY shows the FIRST gif frame if the reload button is pressed.
* INCORRECTLY shows the FIRST gif frame if the URL is reentered from the URL bar.
* INCORRECTLY shows the FIRST gif frame if the page change button is pressed (i.e. Javascript change page).
* INCORRECTLY shows the FIRST gif frame if theURL is reentered from the URL bar after clearing the image from cache.
* INCORRECTLY shows the FIRST gif frame if the page change button is pressed (i.e. Javascript change page) after clearing the item from cache.
All of these tests were run with Windows XP-Pro (all service packs and updates applied).
I can find no clear specification as to what ''should'' happen with pages using animated gifs that are already loaded.
* I can conceive of rationales for always displaying with animation.
* I can also conceive of rationales for sometimes displaying the last frame, especially if the same page is being reloaded since many sites reload the same page in response to user form submissions.
# '''I can see no rationale for displaying the first frame of the gif and would suggest that this is a bug. '''

Can be this bug:
* [https://bugzilla.mozilla.org/show_bug.cgi?id=641198 Bug 641198] – Rollover animated gif show only one frame.
You can try these nightly test builds to see if they behave better:
Fx5.0 ftp://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-mozilla-aurora
Fx6.0 ftp://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-mozilla-central
Create a new profile exclusively for each Firefox version and create a desktop shortcut with -P "profile" appended to the target to launch each Firefox version with its own profile.
See these mozillaZine KB articles for information:
* http://kb.mozillazine.org/Testing_pre-release_versions
* http://kb.mozillazine.org/Creating_a_new_Firefox_profile_on_Windows
* http://kb.mozillazine.org/Shortcut_to_a_specific_profile
* http://kb.mozillazine.org/Using_multiple_profiles_-_Firefox

Similar Messages

Animated gif background - Won't animate!

I have a website which my partner and I have created. I'm really happy with what we have achieved EXCEPT I am trying to add an animated star gif background which is stationary even when I've published it. I've searched so many places for the solution that I'm now thoroughly confused as to if this is possible.
The website is http://www.billieanthony.co.uk and I have added the animated gif to the welcome page only (black/blue stars) to see if it works (which to me doesn't). I added the gif via the page inspector layout section. The other pages only have a static background.
Any comment gratefully received even if it's only to say it can't be done.
Many thanks
Kevin

Step one to enable the community to help debug what you're encountering would be to provide the URL for the page where the GIF is being used. My first guess would be there are effects applied to the image (i.e. inner glow, bevel, etc.) that require Muse to re-encode the image and Muse does not support encoding animated .gif. It only supports passing animated .gif files through unchanged. (And to get an image to pass through unchanged it needs to have no effects that require rasterization applied in Muse.)
Given you've stated the GIF file is 7.5Mb I have to question your choice of .gif. At 7.5Mb this single file will take ~8 seconds to download on the average US broadband connection and will be much slower for many broadband users and most cellular users. GIF is a reasonable choice for very small short animations used sparingly, but is seldom (if ever) a good choice for larger or longer animations. Better choices for those are to use a video or a tool like Edge Animate to create a HTML5/CSS3 animation. The end result will be vastly more user friendly in terms of page load performance.
A huge percentage of first time visitors to a webpage will cancel the page load rather than waiting 8+ seconds for the page load to complete.

Help with animated gif background once opened in Photoshop c33 extended

I often work with animated Gif's and a
adding doggies etc to the top layer.
I am having a problem with animated Gif with (existing transparent) background when saving from the web and opening in Photoshop cs3 extended it is changing the background to White automatically ? ( which is not what I want) I would like to know how to keep in the same format with the tranparent or even change to black as that is the background on my website.....do not know why it is converting it to white in photoshop or how to change....Thank you advance!

Thank you so much....after many hours playing with ....went right too and worked perfect!! Thank you !!

What best adobe programs to (design) and (create) animated gif or image ?

Hello,
first thank you very much for helping me,
i am about creating an animated gif like the background you can see in war craft 3 frozen throne for a game,
i have to design it first with high quality so i need to know best adobe programs can do that, although i need to know the easiest, so i need to know both of them the best and the easiest so if didn't made it with the best i can made it with the easiest pro, and please put in mind that i need a program to design the image from nothing so i will draw it or design it i don't know depending on the program it self but i will not use it for editing or use an image already there, i need an elite pro that allow to create the image from nothing.
after that i need to create an animated gif for the image (gif not good for high quality images so if you know better please tell),
for example "Her hair moves with the moving wind" so i need to move it, i don't know how so i need a program to make it move too.
last thing at the end i need the file type be accepted in html(5) adobe games programs like flash builder or flash pro for example, i know flash pro can animate it but will not design it, thank you again.

It may require a few different apps. Clearly the number one app is you and your ability to conceptualize. And, it depends on what type of animation you ultimately want produced. Game graphics is a lot different than a web banner animated .gif. I'm thinking Illustrator, Photoshop, Edge Animate, and After Effects.

Animated gif background

Is there a way to remove the background from an animated gif. I do not remember this problem in 06, but now when inserting a gif there is a white background. Has anyone found a workaround that. I looked in the forum but did not find an answer.
Thank you
Mireille

Fabe,
As I was uploading a gif to show you what I meant, I looked at it and lo and behold it is working correctly. I wonder if it is part of the fix in the new update of leopard.
Anyway thank you for your reply and making me look again.
Mireille

CSS placed animated GIF background not playing in IE6

http://www.workandpartners.com/WAP/
White two-frame GIF animation background .plays fine in Firefox, but suddenly stopped working in IE6.
Could it be my F-Source navigation is in conflict? What to do...
I'm at my wit's end, and client coming 9:00 AM tomorrow.
Platform is PC - WinXP Pro
Any assistance deeply appreciated
TIA

See if fixing the validation errors helps:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.workandpartners.com%2FWAP%2F

Very Simple Question About Animated GIF Background

Hi,
Till now I didn't realise that I don't have to copy the whole
picture into every frame, I can simply keep the "static" part as a
background, and animate only the changing object (for example, some
letters). This way the final file will be much smaller in size.
I right-click on the selection and choose Animate Selection,
but then I don't know how to arrange the animated selection and the
background static picture to achieve the desireble result.
Please advise.
Andy

Anna2257 wrote:
> Hi,
> Till now I didn't realise that I don't have to copy the
whole picture into
> every frame, I can simply keep the "static" part as a
background, and animate
> only the changing object (for example, some letters).
This way the final file
> will be much smaller in size.
> I right-click on the selection and choose Animate
Selection, but then I don't
> know how to arrange the animated selection and the
background static picture to
> achieve the desireble result.
> Please advise.
> Andy
>
Seeing your PNG file would take a lot of the guesswork out of
this, but
basically:
Put the static elements on one layer and choose to share that
layer to
frames.
Either add your animation elements to separate frames or read
up on
using animation symbols.
You can check out this list of tutorials as well, and/or post
a link to
your PNG file so we can be more detailed in our advice.
http://tinyurl.com/2ljze9
Jim Babbage - .:Community MX:. & .:Adobe Community
Expert:.
http://www.communityMX.com/
CommunityMX - Free Resources:
http://www.communitymx.com/free.cfm
.:Adobe Community Expert for Fireworks:.
Adobe Community Expert
http://tinyurl.com/2a7dyp
See my work on Flickr
http://www.flickr.com/photos/jim_babbage/

An Animated GIF displays, i.e. moves, for about 5 minutes, then freezes. Other GIFs from the site work indefinitely, and this GIF works indefinitely on IE. Why does it freeze in Firefox?

An Animated Avatar GIF file moves as expected for about 5 minutes, and then freezes. Other animated avatars from the same site work fine, and move indefinitely. To confirm that the site had not exchanged the file for a non-animated version, I right-clicked and selected 'View Image Info' and when I did so, it moved for about half a second. (The image file was the one uploaded.) Loaded the page in IE, this avatar moves indefinitely.
Any ideas why an animated GIF stops in Firefox?

The answer is that Animated GIF files include a Loop Enable Flag as well as a Loop Limit Count. This GIF had a count which should have allowed it to loop for almost 2 hours. But in Firefox it only loops for about 5 minutes.
It appears Firefox is misinterpreting this value to be a Frame Count rather than a Cycle Count.
Is there any Firefox Employees reading this, and can acknowledge this has been added to their Opportunity (a.k.a. Bug) List?

Fireworks CS4 animated gif - ghosting - Help Please!

I have creadted a skyscrapper ad using Frieworks with a gradient on the background. When it is played on a PC (I use a Mac), there is ghosting of the text. Does anyone know how to get rid of this? It looks fine on my Mac. When I save as an animated gif, I select dither to make the gradient look smoother. Help! Please!

Hi,
Animated gif backgrounds with gradient would definitely look ghosted or distorted because of the way GIF images are generated. Take a look at the solution suggested in this tutorial http://www.smartwebby.com/free_tutorials/website-design-how-to/GIFs-optimization.asp - I think using the Exact setting might make your Animated GIF with gradients smoother.
- Anita

Saving Animated .GIF Incorrectly?

Please help! I am trying to save an animated .gif with images
that will rotate through every 1 second.
Here is what I am doing...what am I doing wrong???!!!!
Step 1: I create two frames
Step 2: I add one image to each frame
Step 3: I change the frame delay from the default 7/100 to
100/100, which should be one second
Step 4: I save the image as an animated.gif.
For some reason, despite the frame delay being correct, the
image rotates through at an incredibly fast rate. It seems to stay
at the default 7/100 frame delay and I can't correct it. Even if i
save it as a 3500/100 delay, it still rotates very quickly.
Can anybody help me? This is very frustrating!!

quote:
Originally posted by:
smackitsakic
Please help! I am trying to save an animated .gif with images
that will rotate through every 1 second.
Here is what I am doing...what am I doing wrong???!!!!
Step 1: I create two frames
Step 2: I add one image to each frame
Step 3: I change the frame delay from the default 7/100 to
100/100, which should be one second
Step 4: I save the image as an animated.gif.
For some reason, despite the frame delay being correct, the
image rotates through at an incredibly fast rate. It seems to stay
at the default 7/100 frame delay and I can't correct it. Even if i
save it as a 3500/100 delay, it still rotates very quickly.
Can anybody help me? This is very frustrating!!
There is a bug in the Property Inspector's
Default Export Options that resets frame delays to 7,
whenever you change the options from there. So, don't even touch
it. :-) There are a couple things you could do instead:
When you save the GIF, use Export Preview first
(Ctrl+Shift+X). There, click on the Options tab and select Animated
GIF as the format. Click Export, specify a location and that should
export a GIF with your specified frame delay.
If you really want to set the default export options on the
source PNG, then use the Optimize window (F6). It has exactly the
same interface as the Property Inspector's default export options,
but it doesn't reset the frame delay when you specify "Animated GIF
WebSnap 128". Go figure...
That's how it works on CS3 here. I hope it will work out for
you as well. :-)
SiamJai
~~~~
http://design.thaiwonders.com
- Innovative Fireworks Tutorials

How do I set up firefox to open an animated gif in outlook 2010 - it just "new tabs"s out

After changing the .mht and .mhtml associations to firefox (from IE), when I click on an animated gif in a mail message and select "open in browser", firefox opens, then just "tabs" away (like it's opening each frame separately). How can I get firefox to display the animation like IE used to?

guigs2,
Thanks - using "unmht" did the trick. I searched addons for "mht" and came up blank. I knew there HAD to be something out there - thanks again for the pointer.
Rabitt

Animated gif is not moving in the FireFox 3.6.3 ?

why animated gif is not moving in FireFox 3.6.3 ?
== This happened ==
Every time Firefox opened

Same problem in save mode. An animated gif will not start. No offending plugins or themes are installed.
But if I right-click on the animation and then on "Grafik-Info anzeigen" (maybe "show grafic info") then as soon as the info window starts the animation, it is also started in the browser!
And this error does not happen on all machines. My Win7 64bit does it right. My XP 32bit (freshly updated) freezes the animation. Weird world.

Why are the animated Gifs in Firefox 4 moving so slow and choppy?

When ever I try and look at an animated gif in firefox 4, well, it's just slow and choppy. I google searched and haven't found and remedies to the situation.

Try to disable hardware acceleration.
*Tools > Options > Advanced > General > Browsing: "Use hardware acceleration when available"
If disabling hardware acceleration works then check if there is an update available for your graphics display driver.

Why are animated GIFs in Firefox 11 slow? I downgraded to Firefox 10 and the animated GIFs suddenly play fine again, so I am positive that the update messed up the playback delay of animated GIFs somewhere.

Self-explanatory. I am positive that the GIF I am viewing is faster than what it's supposed to be. I viewed the same animated GIF in another browser and it plays fine. It just plays slower in Firefox 11. I downgraded to Firefox 10 and the animated GIFs were fine again. I upgraded back to 11 and yet again the animated GIFs slowed down. This happens for all of my animated GIFs.
I like viewing my animated GIFs, and since I don't have any problems yet with Firefox 10, I'll be sticking with it for a while...

Yes I have exactly the same problem, and it has NOT been solved yet in Firefox 14. Please Mozilla, what is the use releasing more and more "major upgrades", Firefox 11, then 12, then 13, then 14 (one per month !) if you don't even care to fix the big problems ? That is just marketing crap, nothing more. You guys used to do amazing job, but the new policy is just unbearable, no offense meant : you need to react !

Firefox slows down when opening a site with animated gifs

After updating to FF4, I find that whenever I try to open a page that has multiple animated gifs on it, firefox slows down tremendously. CPU usage goes up to 50-75% and all animated gifs are moving really slow.
It's not only large animated gifs, but it also occurs on forums that have animated smilies. I never had this problem in FF 3.6 nor any other browser (IE, Chrome, Safari). If I start FF4.0 without any add-ons or plugins it does the same thing. Even with a fresh install. Does anyone have a solution to his problem? Since I can't use some of my favorite sites now with FF, without my pc slowing everything down.

Disabling the hardware acceleration worked for me!

Firefox 4.0: Improper handling of Animated Gif background-image

Similar Messages

Maybe you are looking for