0

我正在组合一个特色内容滑块元素,虽然技术上一切正常,但是当快速单击导航按钮时,我仍然会遇到动画构建。这是我的代码:

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 函数的其他调用完全的。

我也尝试过 stop(true,true) ,结果没有差异。

任何帮助将不胜感激。谢谢你。

4

1 回答 1

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

于 2012-10-05T00:42:08.640 回答