CSS rotateX在Chrome中的旋转方向与Safari、IE、Edge和Firefox相反

我试图在enter上添加一个看起来像老虎机旋转的动画。我的问题是我想要所有的数字从下到上旋转。除了chrome之外，这个提琴器在所有浏览器中都可以使用。Chrome从上到下旋转数字

如果我添加-webkit-前缀，那么它会在Safari中将其反转。有什么想法吗

本质上，我试图从

transform: rotateX(-72deg) translateZ(20px);

到

根据您需要的javascript来测试用户代理，实际上只注入safari类，或者在您的情况下只注入chrome类

if (navigator.userAgent.indexOf('Chrome') != -1) {
  $('.carousel').addClass('chrome-only');
}

---

问题中的开始和结束状态是相同的。此外，它们与你的Fiddler演示不匹配…那是在我发布后几秒钟编辑的。我不知道stackoverflow何时更新，以便其他人可以看到。变换范围是从-72度到72度。更多细节请看小提琴手。

if (navigator.userAgent.indexOf('Chrome') != -1) {
  $('.carousel').addClass('chrome-only');
}