590409 - Visual ghosting/trailing on moving DOM elements during animation

Status: RESOLVED FIXED

(Core :: Web Painting, defect)

Description

[Joseph Huckaby]

User-Agent:       Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b4) Gecko/20100818 Firefox/4.0b4
Build Identifier: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b4) Gecko/20100818 Firefox/4.0b4

When the options view expands, the elements on the right side contain ghosting/trailing as they fade in and move to take up space.  This bug actually has nothing to do with the color cycling in the main canvas element shown in the example.

In the code, the options panel div already exists, and is simply opacity-faded in, while the absolutely positioned container div is moved to the left to keep the whole thing centered.  The options panel div is floated to stay side-by-side with the main view.


Reproducible: Always

Steps to Reproduce:
1. Go to http://www.effectgames.com/demos/canvascycle/?sound=0
2. Click the "Show Options" button.
3. Watch as the animation happens to reveal the options panel.
Actual Results:  
The elements in the options panel contain visual ghosting/trailing on the left side as they fade in.

Expected Results:  
The elements should fade in cleanly, without any ghosting or trailing.

This works properly in Firefox 3.6.8, Chrome 5, Safari 5, and Opera 10.

Comment 1

[Joseph Huckaby]

Bug also occurs with FF nightly: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b5pre) Gecko/20100824 Minefield/4.0b5pre

Comment 2

[Timothy Nikkel (:tnikkel)]

Does this still happen in latest nightlies? I can't reproduce.

Comment 3

[Joseph Huckaby]

Confirmed fixed in the latest nightly on Mac OS X 10.6.4: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0b7pre) Gecko/20100930 Firefox/4.0b7pre

Thanks guys!