javascript - 如何使用 slider 更改 anime.js 事件的速度(持续时间)？

Question

我正在使用 anime.js 为从容器边缘弹回的元素制作动画。我希望能够使用页面上其他位置的范围 slider 来调整此动画的速度。

我的问题是，虽然 调整了持续时间，但 slider 似乎完全实例化并且不会继续动画到它最初应该去的地方。我希望它从最左边到最右边，但是当我调整它的大小时，动画只会从调整大小的地方到容器的末尾。

这些是我调用 slider 的 onchange 方法时的尝试。

    function adjustSpeed() {
    alternate.duration = 300;  
    } 

和

function adjustSpeed() {
var alternate = anime({
    targets: '#alternate .el',
    translateX: width,
    direction: 'alternate',
    loop: true,
    duration: 300,
    easing: 'linear',
});

如有任何帮助，我们将不胜感激。

Answer 1

我刚遇到这个问题，我找到了一个更好但不完美的解决方案。 AnimeJS 有另一个静态 speed 属性，默认设置为 1。如果更改此速度，动画速度会发生变化，尽管动画会“跳跃”并且看起来不流畅。

例如，如果您希望速度是原始速度的 0.5 倍，请设置 anime.speed = 0.5。

如果我想出更好的解决方案，我会更新这个答案。