使用 jQuery .stop(） 仅停止 .fadeTo(） 效果

我的网页上有两个jQuery效果，<div>。我用animate()左右移动它，当鼠标不在<div>上时，我用fadeTo()淡出它。

我想使用 jQuery stop() 函数来防止鼠标在<div>上快速来回移动时出现多种淡入淡出效果，如下所示：

$("myDiv").stop().fadeTo(speed, opacity, callback);

不幸的是，如果我这样做，那么它也会停止我的动画，这是我永远不想要的。如果我开始动画，我总是希望它完成。我怎样才能做到这一点，同时防止闪烁褪色问题？

我在 stop(( 的 jQuery 文档中注意到了这一点：

从 jQuery 1.7 开始，如果第一个参数作为字符串提供，则只有该字符串表示的队列中的动画将被停止。

这似乎是我问题的解决方案！或者至少在我试图找出如何将fadeTo效果分配给命名队列之前是这样。我可以很容易地看到如何使用 animate() 来做到这一点，通过使用 animate(( jQuery 文档中指定的选项参数。但是在fadeTo(( jQuery文档中看起来没有可比的东西。但这很奇怪，因为我可以看到在文档中为 fadeIn() 、 fadeOut() 和 fadeToggle() 指定此选项的能力。但为什么不fadeTo()呢？

我在这里错过了什么吗？还是有其他方法可以完成我想要的？

<div id="div1">
    <div id="div2">
        <div id="div3">
            <div id="div4">
            </div>
        </div>
    <button id="myButton" onclick="doACoolAnimation()" ></button>
    </div>
</div>

我使用这个JavaScript来完成淡入淡出：

$('#div1').mouseenter(function() {
    fadeElementTo('div1', 500, 1);
}).mouseleave(function() {
    fadeElementTo('div1', 500, 0.5);
});

我的fadeElementTo()函数非常简单：

function fadeElementTo(eid, speed, opacity, callback) {
    $("#" + eid).stop().fadeTo(speed, opacity, callback);
}

当我的按钮被单击时，它会通过简单地向左或向右移动按钮来激活与淡入淡出的相同div动画。

function doACoolAnimation() {
    var hiddenState = GLOBAL_VAR.hiddenState;
    // If the <div> is already hidden, make it visible
    if (hiddenState == null || hiddenState == 1) {
        GLOBAL_VAR.hiddenState = 0;
        $("#div1").animate({
            left: "0px"
        }, 1500);
    }
    // Otherwise, hide it
    else {
        GLOBAL_VAR.hiddenState = 1;
        $("#div1").animate({
            left: "-800px"
        }, 1500);
    }
}