我很难使用 CSS 过渡在 webkit 中将项目旋转 360 度。
我创建了一个JS小提琴来展示我正在尝试做的事情：http://jsfiddle.net/russelluresti/PnTk8/2/
过渡应分两步进行。首先，物品应该沿 Y 轴旋转 1/2 圈。然后，一旦过渡完成，它应该向相反的方向旋转一整圈，并缩小到原始大小的 1/2。我遇到的问题是第二个过渡只是缩放而不是旋转，即使旋转值 rotateY(-360deg) 和 rotateY(0deg) 应该会导致完全旋转。
这只是一个概念验证，所以我目前只针对webkit。但是，我想坚持使用过渡，而不是关键帧动画。有什么想法吗？
据我所知，从旋转Y（-180度）旋转到旋转Y（-360度）将与旋转Y（0）的状态相同。让我们这样说吧：想象一下，你朝同一个方向翻动一张纸两次，与开始时的状态完全一样。结果，浏览器将其视为"完全没有变化"，因此在旋转时没有过渡。
另一个例子会更清楚地说明这一点：
根据您的情况设置度数，旋转Y（-90度） => 旋转Y（-300度） => 旋转Y（60度） 将正常工作，第二个过渡不会开始。因为相对于原始状态：旋转Y（0），旋转Y（-300度）与旋转Y（60度）处于同一状态。