Can'；无法获取JQuery。请停止以正常工作

我正在使用jqueryanimate，将鼠标悬停在“按钮”上几次，然后返回时，会弹出一个图像。我试图使用停止功能来防止光标在按钮上来回移动时图像上下跳动。我似乎无法使停止功能正常工作。当我把停止放在动画之前时（我把它放在第一个之前。动画，所有的和最后一个之前都没有用），图像根本不会弹出，否则会出现错误。我不确定我做错了什么

 $(document).ready(function(){
 $("#bearup").hover(function(){
 $("#shopbears").animate({top:['-=120px','swing']},2000).animate({top:'+=0px'},2000)
 .animate({top:'+=50px'},3200).animate({top:'+=70px'});
 });
 });

---

我为动画问题制作了一把小提琴。也许有人能想出一种方法来防止运动堆积。

假设您没有遇到光标导致悬停的问题，然后取消悬停，然后在移动购物熊时再次悬停，这可能会解决您的问题：

$(document).ready(function(){
 $("#bearup").hover(function(){
 $("#shopbears")
  .finish()
  .animate({top:['-=120px','swing']},2000)
  .delay(2000)
  .animate({top:'+=50px'},3200)
  .animate({top:'+=70px'});
 });
});

---

在对不同的选项进行了一些测试之后，我找到了一个似乎一直有效的解决方案。答案是使用finish（）而不是stop（），但是finish（）似乎与.delay（）有问题（或者至少delay（）和animate（）一起）。因此，使用animate（）创建延迟效果最好。我无法想象很多人会需要这个，但你永远不知道

$(document).ready(function(){
$("#button").mouseenter(function(){
$("#image") 
.finish().animate({top:['-=120px','swing']},2000)
.animate({top: '+=0px'},2000)
.animate({top:'+=50px'},3200)
.animate({top:'+=70px'})
;
});
});

---

您能提供相关的标记以及您试图调用jQuery.stop的确切位置吗？您有JSFIDLE吗？如果没有，我建议制作一个，以帮助人们更快地解决您的问题。停止点在哪里？侧注，使用带有递增值的停止点将导致问题，并且

+=0px

您将立即执行所有

动画

功能。可以通过将它们嵌套在上一个动画的回调函数中来延迟它们。然后，在第一个

动画（）

+1-finish（）开始之前，您应该只需要

停止（）

，您不会经常看到finish（）。我从@robert McKee运行脚本，它似乎解决了堆叠问题，但每当光标运行到“bearup”区域，无论脚本是否已完成运行，脚本都将重新启动。此外，图像在运行后并不总是回到起点。