7

最新のブラウザと古いブラウザの両方のスライダーも作成しています。私は、CSS3 をサポートする最新のブラウザーで、translate3d と transition を使用してアニメーションを作成しています。古いブラウザでは、2D のトップ、レフト、イージング関数を使用しています。ここからcss3イージングを使用します：

http://matthewlein.com/ceaser/

古いブラウザで使えるようにjavascript関数に変換したいです。イージング関数がたくさんあることは知っていますが、変換方法を知りたいだけです。出来ますか？

4

2 に答える 2

9

jQueryで Cubic Bezier Easings にjQuery Bezプラグインを使用できます。

デモ: http://jsfiddle.net/SO_AMK/sbZ7a/

jQuery:

$("#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

于 2012-09-16T19:53:57.013 に答える
3

答えがすでに受け入れられていることは知っていますが、アニメーションの緩和に適した別の優れた jQuery プラグインを共有したいと思います。

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

于 2012-09-17T07:06:38.890 に答える