jQuery停止动画

所以我有一个新闻项目的列表，有AJAX控件来创建，编辑或删除。在其中一项行动中，顶部会显示一条小小的信息，确认他们做了什么。因此，如果他们添加新帖子，它会弹出“新增新闻：标题”。它滑落，然后在10秒后滑回。问题是，如果在10秒钟之前完成多个动作，则会多次动画。jQuery停止动画

例如：创建标题为“one”的消息 - 消息关闭。

4秒后，创建标题为“two”的新闻 - 消息下来。

6秒后，“one”的消息向上滑动，然后又过了4秒，“two”的消息向上滑动。

我希望它只能滑动一次，因此您可以排列尽可能多的动作，然后在最后一个动作10秒后，它会向上滑动。

这里就是我的了：

$('#ajax-message').html('Added News: ' + title); 
$('#ajax-message').slideDown('1000').delay('10000').slideUp('1000');

来源

2011-05-03 CrazeD

您可以请发布一些代码（也许在jsfiddle.net）与困扰的代码，所以我们可以准确地帮助你？ – Dutchie432 2011-05-03 19:49:33

我会做的是使用的setTimeout ，并且每次完成一项新操作时，清除先前的超时并创建一个新的超时。

喜欢的东西：

var timerID; 

... 
// when an action occurs 
clearTimeout(timerID); 
timerID=setTimeout(function(){ 
    $('#ajax-message').slideUp('1000'); 
},10000);

来源

2011-05-03 19:53:41

这有效，除非它不正确地重新启动超时。例如，如果我创建了一条新闻，然后在7秒后再创建另一条新闻，则该消息只会持续3秒。 – CrazeD 2011-05-03 20:10:34

我错过了setTimeout中的时间参数。 – 2011-05-03 20:16:20

是的，我已经加入了 - 但它仍然发生。 – CrazeD 2011-05-03 21:06:26

听起来你遇到与动画队列中发出建立。你有没有试过jQuery.stop（）？

http://api.jquery.com/stop/

为了避免这种情况，可能是更好的做法，更好，如果你使用的jQuery.queue（）/ jquery.dequeue（）函数适用于：http://api.jquery.com/queue/

来源

2011-05-03 19:52:17 chrisjlee

会停止取消延迟吗？我在搜索中发现了混合报告。 – 2011-05-03 19:59:04

我不完全肯定，但我不认为它应该：http://jsfiddle.net/UrCZH/ – chrisjlee 2011-05-03 20:36:25

您可以检查是否#ajax_message是通过检查它的知名度，停（开），所以它不会再次效果基本show，.append（）新的消息，目前的消息，然后执行延迟效果基本show再次

if($('#ajax_message').is(':hidden')) 
{ 
    $('#ajax_message').html('AddedNews'+title).slideDown('1000').delay('10000').slideUp('1000'); 
} 
else 
{ 
    //is opened 
    $('#ajax_message').stop().append('<br />AddedNews'+title).delay('10000').slideUp('1000'); 
}

（未测试的代码）

编辑： 改变了测试可视性的方法。谢谢@kingjiv

来源

2011-05-03 19:59:39 Andre

你可以使用is（“：hidden”）而不是检查CSS中的显示。 'if（$（'＃ajax_message'）。（'：hidden'））' – 2011-05-03 20:03:20

jQuery停止动画

回答

相关问题