Question

我正在整理一个精选内容滑块元素，虽然从技术上讲一切正常，但是当快速点击导航按钮时，我仍然会遇到动画构建。这是我的代码：

this.LRSliderScrollVert = function(j) {
    var viewOutside = GetObject(this.sliderObjectId);
    if (parseInt(viewOutside.style.top) == 1 && j == 1){
        //do nothing
    } else if (parseInt(viewOutside.style.top) == this.sliderBottomLimit && j == -1) {

    } else {
        //viewOutside.style.top = parseInt(viewOutside.style.top) + j +'px';
        var total = parseInt(viewOutside.style.top) + j + 'px';
        $(viewOutside).stop().animate({
            top: total
        }, 700, 'swing');
    }
}

正如你所看到的，我已经在使用stop（），但它似乎没有给我我想要的结果，只需点击一下即可调用动画，并且在第一次调用之前不会处理对animate函数的其他调用动画已经完成。

我已尝试停止（真实，真实），但结果没有差异。

非常感谢任何帮助。谢谢。

Answer 1

.stop(true, true)停止当前正在运行的动画，将其前进到结尾并将其从动画队列中删除。这听起来不像你要做的那样。

如果您希望后续动画在正在进行的动画完成后再进行，则只需删除.stop()，因为新动画将在当前动画之后添加到队列中。

如果您希望后续动画在对象当前为动画时根本不启动，则可以检查对象当前是否为动画，如果是，则避免开始另一个动画。

要在以后动画仍然是最后一次点击动画时忽略它，您可以执行以下操作：

this.LRSliderScrollVert = function(j) {
    var viewOutside = GetObject(this.sliderObjectId);
    if (parseInt(viewOutside.style.top) == 1 && j == 1){
        //do nothing
    } else if (parseInt(viewOutside.style.top) == this.sliderBottomLimit && j == -1) {

    } else {
        var total = parseInt(viewOutside.style.top) + j + 'px';
        // remove any objects from the selector that are currently animating
        // if there are none left, then it will do nothing
        $(viewOutside).not(":animated").animate({
            top: total
        }, 700, 'swing');
    }
}

我删除了.stop()因为那不是你想要的。这会停止当前的动画，但你说你希望它继续下去。你想要跳过的是当前动画正在运行的任何未来动画。

我添加了.not(":animated")以从当前动画选择器中删除任何对象。如果你的一个对象是动画，这将留下一个空的jQuery对象，然后在你调用.animate()方法时什么都不做。这只会在测试.is(":animated")上保存一些代码，并在该结果上使用if语句。

使用stop（）建立JQuery动画

1 个答案: