如何将 css3 过渡缓动转换为 jquery 缓动函数

Question

我也为现代浏览器和旧浏览器制作了一个滑块。我使用 translate3d 和过渡在支持 css3 的现代浏览器中制作动画。我为旧浏览器使用 2d 顶部、左侧和缓动功能。我从这里使用 css3 缓动：

http://matthewlein.com/ceaser/

我想将其转换为JavaScript函数以在旧浏览器上使用。我知道那里有很多缓动功能，但我只想知道如何转换。可能吗？

Answer 1

您可以在 jQuery 中使用 jQuery Bez 插件进行 Cubic Bezier Easings：

演示：http://jsfiddle.net/SO_AMK/sbZ7a/

j查询：

$("#box").click(function() {
    $(this).animate({
        "margin-left": 200
    }, 2000, $.bez([0.685, 0.595, 0.020, 0.720]));
});
// Take the Ceaser output and put the values in, in order, like above. i.e. cubic-bezier(0.685, 0.595, 0.020, 0.720) would end up as the above value​

插件：https://github.com/rdallasgray/bez

Answer 2

我知道

答案已经被接受，但我想分享另一个适合简化动画的出色jQuery插件。

http://ricostacruz.com/jquery.transit/