JavaScript动画

我正在尝试用JavaScript构建一个滑块模块。一切正常，但动画是线性的，感觉不平滑或自然。我曾想过建立一个缓和方程，但我不确定它会走向何方

以下是我借用的动画功能：

以及一个缓解功能：

我试着像这样传递我已经拥有的值：

elem.style[style] = easeInCubic(start, from, to, time) + unit;

但很明显，这是错误的（我对数学不太在行，我承认我只是在猜测）

---

如何将两者结合起来？

您的方法还可以，只是使用了错误的参数。 正如它所说的，t是当前的时间，d是整个动画时间

function animate(elem, style, unit, from, to, time) {
    if (!elem) return;
    var start = new Date().getTime(),
        timer = setInterval(function() {
            var step = Math.min(1,(new Date().getTime()-start)/time);
            elem.style[style] =  easeInCubic(step*time, from,step*(to-from), time)+unit;

            if (step == 1) clearInterval(timer);
        },25);
    elem.style[style] = from+unit;
}

---

你的方法是正确的，你只是使用了错误的参数。 正如它所说的，t是当前的时间，d是整个动画时间

function animate(elem, style, unit, from, to, time) {
    if (!elem) return;
    var start = new Date().getTime(),
        timer = setInterval(function() {
            var step = Math.min(1,(new Date().getTime()-start)/time);
            elem.style[style] =  easeInCubic(step*time, from,step*(to-from), time)+unit;

            if (step == 1) clearInterval(timer);
        },25);
    elem.style[style] = from+unit;
}

---

t

是当前时间，或者更准确地说是经过的时间。在您的情况下，

newdate（）.getTime（）-start

c

是开始和结束之间的区别，在您的例子中是

from-to

        var elapsedTime = new Date().getTime() - start;
        elem.style[style] = easeInCubic(elapsedTime, from, to - from, time) + unit;
        if (elapsedTime >= time) clearInterval(timer);

---

t

是当前时间，或者更准确地说是经过的时间。在您的情况下，

newdate（）.getTime（）-start

c

是开始和结束之间的区别，在您的例子中是

from-to

        var elapsedTime = new Date().getTime() - start;
        elem.style[style] = easeInCubic(elapsedTime, from, to - from, time) + unit;
        if (elapsedTime >= time) clearInterval(timer);

---

您可能可以从中获取现有的放松功能。您有JSFIDLE吗？您可能可以从中获取现有的放松功能。您有JSFIDLE吗？