1

让我们看这个脚本：

$('a').hover(function() {
    $('div').stop(c,j).fadeIn();
}, function() {
    $('div').stop(c,j).fadeOut();
});

随着c=0,j=0，如果我a重复几次，我的 div 淡入淡出，然后...... yerk。
有了c=1,j=1，它几乎可以满足我的要求，但是由于jumpToEnd参数的原因，我们得到了这种闪烁效果，而且看起来有问题。
所以最后，我想要的是c=0,j=1，但是如果我进入，然后快速退出并重新进入，动画就会停止，下一个淡入淡出功能将不会启动，我的 div 是半透明的。为什么 ？

另一个视觉示例。

我经常遇到这个问题，想知道为什么我在上面找不到任何东西。（最后我记得是对 jQuerystop()页面的评论，但现在已删除评论。）

4

1 回答 1

0

这是所有不同用法之间的更好比较：http .stop(): //jsfiddle.net/4v8Uk/13/

<div data-one="0" data-two="0" id="a">a</div>
<div data-one="1" data-two="0" id="b">b</div>
<div data-one="1" data-two="1" id="c">c</div>
<div data-one="0" data-two="1" id="d">d</div>

$("div").hover(function(){
    var d = $(this).data();
    $(this).stop(d.one,d.two).toggle("slow");
});

选项 a 和 b 似乎更接近您正在寻找的内容。（0,0 和 1,0）

更新：我仍然没有一个明确的答案来解释它为什么会发生，尽管我相信它发生是因为 jQuery 看到了已经显示的元素，因此它没有显示它。为什么这不会影响 .toggle() 我不知道。

但是，您可以通过使用 .animate 重新创建动画来修复它。

http://jsfiddle.net/4v8Uk/17/

$("div").hover(function(){
    var d = $(this).data();
    $(this).stop(d.one,d.two).animate({"opacity":"0", "height":"0px", "width":"0px"},"slow");
}, function(){
    var d = $(this).data();
    $(this).stop(d.one,d.two).animate({"opacity":"1", "height":"100px", "width":"100px"},"slow");
});
于 2013-01-31T19:23:39.923 回答