CSS3 动画和过渡不流畅

Question

我正在尝试为一个元素开发一个幻灯片插件，但我遇到了 CSS3 动画/过渡的问题。

您可以在这里查看: http://jsfiddle.net/75Sjb/

我想做什么

• 每张幻灯片都有 transform: translate3d(-100%,0,0) 和 transition: all。这样，不活动的幻灯片就在 View 之外，在左侧，并且可以顺畅地四处移动。

• 事件幻灯片还有一个动画，其 from 部分显示 transform: translate3d(100%,0,0)，以及在其 CSS 中作为 的新转换属性翻译 3d(0,0,0)。因此，它们在 View 中从恰到好处的动画变为紧贴 View 。

问题

在 Webkit 中

虽然第一次选择一张幻灯片是正确的动画，但之后的每一次都是拙劣的。从事件状态变为非事件状态的幻灯片不会动画化。

在 Firefox 中

在 Firefox 中，从事件状态到非事件状态的滑动很好；但事件幻灯片从左侧滑入(动画不起作用)。

Answer 1

也许这是旧版浏览器的问题，但动画现在工作正常。