.item {
transition: transform 1s linear;
transform: rotate3d(0, 0, 0, 0deg);
}
.item:hover {
transform: rotate3d(0, 0, 1, 450deg);
}
在上面的例子中,Chrome将.item
旋转了整整450度。虽然Firefox,Edge和Safari在开始和结束状态之间旋转,导致90度旋转较小。
这似乎只发生在rotate3d
。使用rotateZ
会使所有浏览器完全旋转450。
猜猜这是Chrome中的一个错误?有谁知道spec足以确认?
CodePen上的演示。