Summary: | Applying element.style.WebkitTransform with transition set fails to animate | ||||||
---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | Shawn Lauriat <shawn> | ||||
Component: | CSS | Assignee: | Simon Fraser (smfr) <simon.fraser> | ||||
Status: | RESOLVED INVALID | ||||||
Severity: | Normal | ||||||
Priority: | P2 | ||||||
Version: | 528+ (Nightly build) | ||||||
Hardware: | Mac | ||||||
OS: | OS X 10.5 | ||||||
URL: | http://frozen-o.com/misc/enterpriseguts/ | ||||||
Attachments: |
|
Description
Shawn Lauriat
2008-12-02 13:22:06 PST
P.S. If clicking through the presentation and/or picking through the script gets tedious, I can write up a simpler example later on to replicate the issue. I have several setTimeout hacks in place to get around a timing issue most likely long since fixed, where I had to fake multithreaded JavaScript in order to get the animation to render properly. Needs a reduced testcase. The transitions in S5 slides are buggy. See the comments on <http://www.frozen-o.com/blog/2008/09/s5-with-css-slide-transitions-in-webkit.html> (In reply to comment #3) > The transitions in S5 slides are buggy. See the comments on > <http://www.frozen-o.com/blog/2008/09/s5-with-css-slide-transitions-in-webkit.html> > I fixed the noted bug shortly after seeing the comments there, but will post a greatly reduced test case so as not to lose the issue in a JavaScript/DOM/CSS haystack. I'll either resubmit, or just note what really happened if it really did stem from something else. Created attachment 26406 [details]
A test HTML document that should rotate out the p element when you click the "Transform" link
This shows the same behavior I saw in my S5 presentation, but isolated for much easier debugging. It only works on a single element, and doesn't contain anything other than the example to demonstrate this bug.
I've attached a reduced test case, which reproduces the bug as described in the current WebKit nightly build. What are you trying to do with this matrix: matrix(0,-1.99,0,0,0,0) ? That looks degenerate to me. Try applying a reasonable matrix: "matrix(1, 0, 0, 1, 20, 20)" and it works fine. Found my issue! Thank you for your patience, and apologies for this... If you set the WebkitTransform using just matrix() in the first step, then set the WebkitTransition, then set the WebkitTransform using both matrix and scale, it (reasonably) will not apply the transformation. When I set both both functions for the start and end styles, it works beautifully. |