jquery - 停止 jQuery 动画并反转

Question

我有一个像这样工作的移动动画：

 function showMessage() 
 {
     $('#message').stop().show().animate({top: '60px'}, 500, 'easeOutExpo');
 }      

 function hideMessage(msg,hide) 
 {
     $('#message').stop().delay(time).animate({ top: '0px' }, 600, 'easeInExpo');
 }          

动画在显示时将项目移动到 60 像素，然后在隐藏时返回到 0 像素。问题是如果 showMessage 在 hideMessage 完成之前开始，我会得到一个难看的跳转动画。

我想要的是 showMessage 动画基本上反转 hideMessage 动画，如果它在 hideMessage 完成之前开始。

我希望这是有道理的。

Answer 1

您需要确保动画 A 在开始 B 之前完成。

 $('#message').stop(true,true).show();

也就是说.stop([clearQueue] [, jumpToEnd])。这是文档。

你很亲近！ 小提琴