Bug 136697 - Transform animation incorrect on online demo
Summary: Transform animation incorrect on online demo
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL: http://codepen.io/miukimiu/pen/DkvnA
Keywords:
Depends on:
Blocks:
 
Reported: 2014-09-10 01:52 PDT by Dirk Schulze
Modified: 2023-08-23 04:55 PDT (History)
7 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Dirk Schulze 2014-09-10 01:52:53 PDT
I did not check the demo in detail yet, but WebKit is the only browsers that does not render the spinning lines on the tape correctly.

http://codepen.io/miukimiu/pen/DkvnA
Comment 1 Jon Lee 2014-09-10 12:15:41 PDT
Side note: I am seeing some incorrect positioning at .5x on some iPhones.
Comment 2 Simon Fraser (smfr) 2014-09-10 12:29:15 PDT
Incorrect tick placement in the hubs is caused by use of unprefixed transform-origin.

The jumpiness happens because the keyframes rotate from 0->180deg, rather than 0->360deg. I see jumpiness in Chrome too.
Comment 3 Dirk Schulze 2014-09-11 05:20:52 PDT
(In reply to comment #2)
> Incorrect tick placement in the hubs is caused by use of unprefixed transform-origin.
> 
> The jumpiness happens because the keyframes rotate from 0->180deg, rather than 0->360deg. I see jumpiness in Chrome too.

Can confirm that it is just a problem of prefixing. However, there is a visual difference that seems to be a precision problem. Is that because of pixel rounding?

I am fine with closing this bug in general.