[英]Convert CSS cubic bezier easing to Javascript
我正在寻找一种为我的补间生成缓动函数的方法,我需要它们的Javascript函数格式,标准的t, b, c, d
参数。
我找到了一个很好的工具来生成CSS缓存: http : //cubic-bezier.com/但输出对我来说没用。
所需的格式如下:
function(t, b, c, d){
var ts = (t /= d) * t;
var tc = ts * t;
return b+c*(4.257575757575761*tc*ts + -7.9545454545454595*ts*ts + 0.6818181818181834*tc + 4.46969696969697*ts + -0.4545454545454546*t);
}
在JavaScript中有基于Bezier Curve缓存的库https://github.com/gre/bezier-easing
您可以从http://cubic-bezier.com中选择所需的参数,并将它们传递给BezierEasing函数。 例如:
BezierEasing(0.25, 0.1, 0.0, 1.0)
以下是文档中的示例:
像这样:
element = document.getElementById('targetElement');
element.style.transitionTimingFunction = 'cubic-bezier(0.175, 0.885, 0.32, 1.275)';
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.