Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Lolu chungechunge lwabekwa kunqolobane. Uyacelwa ubuze umbuzo omusha uma udinga usizo.

Dropped frames (no display) while animating opacity of a DIV in jQuery

  • 3 uphendule
  • 5 zinale nkinga
  • 1 view
  • Igcine ukuphendulwa ngu Laza

more options

I'm developing a photo gallery web app, called Turtle skin (jAlbum). The cross fades between images work in all browsers, except FireFox (currently using FF7, but not sure it was working before). It seems FireFox hides the animated layer for some 200ms at the end of the animation, which makes the gallery look crippled. Meanwhile all the css properties are reported as expected: display=block, visibility=visible, opacity=1. The behavior is not consistent, though it happens most of the time. See the example album and move back and forth. You'll possibly see the disappearing images.

I'm developing a photo gallery web app, called Turtle skin (jAlbum). The cross fades between images work in all browsers, except FireFox (currently using FF7, but not sure it was working before). It seems FireFox hides the animated layer for some 200ms at the end of the animation, which makes the gallery look crippled. Meanwhile all the css properties are reported as expected: display=block, visibility=visible, opacity=1. The behavior is not consistent, though it happens most of the time. See the example album and move back and forth. You'll possibly see the disappearing images.

All Replies (3)

more options

Some more info: It seems the rendering engine collapses at the final step when the opacity goes from 0.999 to 1.0. If there are no other animations on the same element there's no problem. In the above example I run 5 animations parallel (left, top, width, height, opacity) stopping at the exact same time. If I stop the position and dimension animations well ahead of the dreaded opacity: 0.99->1.0 transition, everything goes fine.

more options

A good place to ask questions and advice about web development is at the mozillaZine Web Development/Standards Evangelism forum.
The helpers at that forum are more knowledgeable about web development issues.
You need to register at the mozillaZine forum site in order to post at that forum.

See http://forums.mozillazine.org/viewforum.php?f=25

more options

I consider this problem is about browser development and not web development. I just wanted to help the mozilla team. In the meantime I could circumvent the problem by stopping all other animations before the transparency change 0.99 -> 1.0 takes place.

Thanks, Laza