Open
Bug 1135894
Opened 10 years ago
Updated 2 years ago
Rotation using matrix3d doesn't interpolate angles along the shorted path
Categories
(Core :: CSS Parsing and Computation, defect)
Tracking
()
UNCONFIRMED
People
(Reporter: ninjaqe, Unassigned)
References
Details
(Keywords: testcase)
Attachments
(1 file)
|
1.33 KB,
text/html
|
Details |
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.111 Safari/537.36
Keywords: regression,
testcase
|
||
Comment 1•10 years ago
|
||
If this is a regression, when from? Where is the testcase?
Flags: needinfo?(ninjaqe)
Compared the rotation between Chrome and Firefox. The rotation in Firefox is incorrect compare to Chrome. I have attached a simple file and please take a look at the spec
http://www.w3.org/TR/css3-transforms/#interpolation-of-3d-matrices
Flags: needinfo?(ninjaqe)
Comment on attachment 8570584 [details]
3d-rotation-animation.html
<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 100px;
height: 100px;
background: red;
position: relative;
-webkit-animation: myfirst 5s;
-moz-animation: myfirst 5s;
-ms-animation: myfirst 5s;
animation: myfirst 5s;
}
/* Firefox */
@-moz-keyframes myfirst {
0% {
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
25% {
-moz-transform: matrix3d(0, 0, -1, 0, 0, 1, 0, 0, 1, 0, 0, 0, 0, 0, 0, 1);
}
50% {
-moz-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -1, 0, 0, 0, 0, 1);
}
75% {
-moz-transform: matrix3d(0, 0, 1, 0, 0, 1, 0, 0, -1, 0, 0, 0, 0, 0, 0, 1);
}
100% {
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
}
/* Chrome, Safari, Opera */
@-webkit-keyframes myfirst {
0% {
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
25% {
-webkit-transform: matrix3d(0, 0, -1, 0, 0, 1, 0, 0, 1, 0, 0, 0, 0, 0, 0, 1);
}
50% {
-webkit-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -1, 0, 0, 0, 0, 1);
}
75% {
-webkit-transform: matrix3d(0, 0, 1, 0, 0, 1, 0, 0, -1, 0, 0, 0, 0, 0, 0, 1);
}
100% {
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
}
/* IE */
@-ms-keyframes myfirst {
0% {
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
25% {
-ms-transform: matrix3d(0, 0, -1, 0, 0, 1, 0, 0, 1, 0, 0, 0, 0, 0, 0, 1);
}
50% {
-ms-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -1, 0, 0, 0, 0, 1);
}
75% {
-ms-transform: matrix3d(0, 0, 1, 0, 0, 1, 0, 0, -1, 0, 0, 0, 0, 0, 0, 1);
}
100% {
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
}
</style>
</head>
<body>
<p><b>Firefox rotates the div differently</b>
<div></div>
</body>
</html>
|
|
||
Comment 4•10 years ago
|
||
Thank you. So not a regression and likely a duplicate of bug 937494.
Depends on: 937494
Keywords: regression
|
||
Updated•2 years ago
|
Severity: normal → S3
You need to log in
before you can comment on or make changes to this bug.
Description
•