等待一个动画完成，然后再开始另一个答案

【问题标题】：Wait for one animation to finish before starting another等待一个动画完成，然后再开始另一个
【发布时间】：2017-04-05 01:47:29
【问题描述】：

我在页脚上有一个 mouseenter 动画，还有一个只是滑动它的鼠标离开动画，我遇到的问题是如果你鼠标进入然后 mouseleave 多次快速动画que并一遍又一遍地运行，即使元素是不再使用。

我如何等待鼠标在它识别鼠标离开之前运行。

非常感谢您的帮助

大卫

$(document).ready(function () {
$("footer").mouseenter(function () {
    $("footer").animate({ bottom: '+=62px' }, 500);
});


$("footer").mouseleave(function () {
    $("footer").animate({ bottom: '-=62px' }, 500);

});
});

【问题讨论】：

标签： javascript jquery function animation

【解决方案1】：

尝试将stop() 添加到您的animate 函数中。它会停止所选元素上当前正在运行的动画。

$("footer").mouseenter(function () {
  $("footer").stop().animate({ bottom: '+=62px' }, 500);
});

$("footer").mouseleave(function () {
  $("footer").stop().animate({ bottom: '-=62px' }, 500);
});

【讨论】：

@David_George 如果有效，请接受答案。