jquery - 如何制作加速的自定义 EaseOut 功能？

Question

我有一个鼠标悬停功能，它基本上会导致 div 向上/向下移动。这使用了一个间隔计时器，并进行了动画处理以使其更平滑。

如何使动画加快每个间隔以匹配最终缓出速度？基本上，当您将鼠标悬停时，它应该会越来越快，但仍会保持流畅的动画效果。

function StartAnimation() {
        var oldMarginTop = $('#MyDiv').outerHeight(true) - $('#MyDiv').innerHeight();
        var newMarginTop = oldMarginTop + 100;
        $('#MyDiv').animate({ marginTop: newMarginTop }, 500, 'linear');
    }
}

$('#SomeObject').bind('mouseenter', function () {
    this.iid = setInterval(function () {
        StartAnimation();
    }, 500);
}).bind('mouseleave', function () {
    this.iid && clearInterval(this.iid);
    //FinishAnimation();
});

Answer 1

我认为你不需要间隔。

我认为，您所描述的是easeIn您可以使用此 jQuery 插件（以及各种替代缓动函数）获得的内容。该页面还包含一个演示，允许您测试每个缓动函数，以找到最适合您要求的缓动函数。

然后，您应该能够使用您直接选择的函数作为调用的参数jQuery.animate。