使动画变慢（jQuery）

Question

我正在尝试通过更改块的位置来制作块的动画。

就像，通过 css left 的动画将块从左侧移动到中间。

问题是，动画过程从开始到结束以相同的速度发生。

我想让动画在最后放慢速度，当到达终点时它应该放慢速度。

我该怎么做？我读过有关缓动插件的内容，但不知道应该使用哪种效果，这是想要的效果。

Answer 1

您想要缓出效果。以下是一些演示：

http://jquery-ui .googlecode.com/svn/tags/1.6rc6/demos/effects_easings/default.html

编辑：

这是一个更“官方”的演示页面：

http://jqueryui.com/demos/effect/easing.html

Answer 2

这是一个关于缓动效果表现的很棒的参考：http ://hosted.zeh.com.br/tweener/docs/en-us/misc/transitions.html。是的，我知道这是针对动作脚本库 Tweener 但所有缓动名称都是相同的（大部分）。

您正在寻找 easeOut 或 easeOutQuad 或 easeOutCubic。 （它们按照开始减速的速度排列）

Answer 3

尝试这样的事情：

$('#yourBlock').animate({
    left: newValue
}, 500, 'easeOut')

Answer 4

$(document).ready(function () {
    $("#imgAnimate").click(function () {
        $("#imgAnimate").animate({ "opacity": 0.0, left: '800px' }, 2500);
    });
});