2012-02-20 243 views
2

我想处理一个菜单,在这里,当你将鼠标悬停在某个项目,一个盒子淡入,另一个项目,另一个盒子淡入:jQuery fadeIn/fadeOut比赛条件?

$('.all').fadeOut('fast', function() { $('#item').fadeIn('fast'); 

,但有时当你用鼠标太快,多事情显现出来,或者所有事情都会再次发生......我如何优雅地处理比赛?

+0

您需要一个信号灯。 – 2012-02-20 22:07:16

+0

@TravisJ,单线程代码中的信号量? – Lucero 2012-02-20 22:12:47

+0

@lucero - Yup,尽管它们的用途主要用于多线程,但信号量的定义用于处理竞争条件。也许一个旋转锁将在这里工作。 – 2012-02-20 22:28:41

回答

6
$('.all').stop(true, true).fadeOut('fast', function() { $('#item').stop(true, true).fadeIn('fast'); 

stop(true)可能就足够了,很难说没有看到你的html。

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

+0

谢谢,我有更多的代码,但真正的上述代码是我所做的。 – Timmy 2012-02-21 01:54:43

1

尝试尝试使用“队列”选项。我不确定它是否在fadeIn函数中可用,但是您可以尝试使用具有队列选项的动画函数对不透明度进行动画处理。 ('。item')。animate({opacity:0},{queue:false});