jQuery 缓动与 CSS3 过渡 - 是否有完全等效的平滑？答案

【问题标题】：jQuery easing vs CSS3 transition - Is there an exact equivalent smoothing?jQuery 缓动与 CSS3 过渡 - 是否有完全等效的平滑？
【发布时间】：2013-07-06 17:31:27
【问题描述】：

我正在使用 jQuery 动画和 CSS3 过渡。

问题是我找不到等效的平滑动画。有吗？

我得到的最接近的是这个（jQuery easeOutQuad 和 CSS3 默认缓动）。

CSS：

#div1 { transition: width 0.5s; }

jQuery:

$('#div2').animate({'width': 200}, 500, 'easeOutQuad');

http://jsfiddle.net/bzw4q/

但它们仍然不同。

我希望两者同时制作动画（使用任何好的缓动算法）。这可能吗？

【问题讨论】：

你也可以定义transition timing functions using CSS3；那是你要求的吗？
为什么不用 jQuery 添加一个类名，然后用它来启动和同步动画？

标签： jquery jquery-ui css

【解决方案1】：

也可以在这里http://easings.net 获得匹配的三次贝塞尔曲线。

【讨论】：

【解决方案2】：

试试swing 和ease-in-out > http://jsfiddle.net/et6Hg/

我认为你有更好的机会:)

【讨论】：

谢谢乌萨马！好消息是“swing”是默认值，缺点是您需要将 jQuery 持续时间乘以 0.96。但这已经足够了，谢谢！