我也爲現代瀏覽器和舊瀏覽器製作滑塊。我使用translate3d和transition來在支持css3的現代瀏覽器中製作動畫。我使用舊版瀏覽器的二維頂部,左側和緩動功能。我使用CSS3從這裏寬鬆:如何轉換css3轉換緩動jQuery緩動功能?
http://matthewlein.com/ceaser/
我想將其轉換爲JavaScript函數使用舊的瀏覽器。我知道那裏有許多緩動功能,但我只想知道如何轉換。可能嗎?
我也爲現代瀏覽器和舊瀏覽器製作滑塊。我使用translate3d和transition來在支持css3的現代瀏覽器中製作動畫。我使用舊版瀏覽器的二維頂部,左側和緩動功能。我使用CSS3從這裏寬鬆:如何轉換css3轉換緩動jQuery緩動功能?
http://matthewlein.com/ceaser/
我想將其轉換爲JavaScript函數使用舊的瀏覽器。我知道那裏有許多緩動功能,但我只想知道如何轉換。可能嗎?
您可以在jQuery中使用jQuery Bez插件三次Bezier漸變效果:
演示: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
你錯過了我的問題。這只是在css3瀏覽器上工作,我需要將css3 easing轉換爲js,以使其在IE瀏覽器等舊瀏覽器上工作:) – StoneHeart
我redid我的答案,對不起,我錯過了。 –
太棒了!這正是我想要的。你做了我的一天:) – StoneHeart
我知道答案已經接受,但我想分享另一個很好的jQuery插件適合緩動動畫。
我想你可以寫一個函數來效仿。你可以使用Easing插件,只使用預建功能? http://gsgd.co.uk/sandbox/jquery/easing/ – Blender
已經有一個jQuery庫,它完全做你正在做的事[jQuery Transit](http://ricostacruz.com/jquery.transit/)你可以使用它或至少看看源:) – Andreas
+1酷動畫工具。 –