1

过去几个小时我一直在研究这个问题,这让我的小脑袋感到困惑。

正在发生的事情是 jQuery 动画动画似乎在动画期间停止,从而阻止了回调的发生。

问题是这种情况间歇性和随机发生,我无法在我的代码中找到问题。它似乎发生大约七分之一。然而它可能发生在第一次或 10 次之后。

在这种情况下,我真的无法组合一个 jsfiddle,因为它与网站的其他部分联系得非常紧密。相反,我想在这里留下一个链接并指向相关部分。以下是相关网站的链接。下面显示的代码从第 219 行开始。如果您查看 firebug 控制台,您可以看到我在代码运行时创建的日志。您还可以看到,left当问题发生时,css 属性并没有一直动画到完成。

下面是显示问题的图像。请注意,cssleft属性不在 664 像素(如果问题没有发生的话)。

在此处输入图像描述

下面是相关代码。

    $(".close").live("click", function() {

        console.log("--------------------");
        console.log("Close button has been clicked");

        var toMove = $(this).parent().attr("class").replace("infoBox ", "");

        $(this)
            .parent()
            .fadeOut("fast");

        console.log("Setting #" + toMove + " back to default position");

        $("#" + toMove)
            .removeClass("active")
            .addClass("ready")
            .delay(100)
            .animate({
                left: $("#" + toMove).attr("data-left").replace("px", "")
            }, 200, function() {
                console.log("Animate has finished. Now checking all images are in the right place");
                resetAll();
                $(".close").remove();
        });
    });

我的问题有什么问题吗?让我知道,我非常乐意修改 + 编辑,使其符合 stackoverflow 的严格标准!

有关的

.animate() 回调的错误?

4

1 回答 1

2

尝试为您的图标添加中间状态。一旦您单击关闭按钮,课程就会从“活动”变为“准备就绪”。例如添加“移动”,并且在其状态为“移动”时不要让任何其他函数被调用。当它返回到初始位置时,您可以再次将类设置为“就绪”。

$("#" + toMove)
        .removeClass("active")
        .addClass("moving")
        .delay(100)
        .animate({
            left: $("#" + toMove).attr("data-left").replace("px", "")
        }, 200, function() {
            console.log("Animate has finished. Now checking all images are in the right place");
            resetAll();
            $(".close").remove();
    })
        .removeClass("moving")
        .addClass("ready");
于 2012-07-08T15:05:10.690 回答