-2

我想让一些角色逐渐出现，所以我建立了这个脚本。然而，延迟似乎根本没有执行——我试图把它放到数千个，结果没有改变。我想念什么？

$(document).ready(function () {

    var 
        i,
        d = [500, 300, 600, 1000],
        t = "String";

    $("body")
        .delay(flashDuration[0])
        .animate({ backgroundColor: "#888888" }, d[1])
        .animate({ backgroundColor: "#222222" }, d[2])
        .animate({ backgroundColor: "#F8ECC2" }, d[3], null, function () {
            for (i = 0; i < t.length; i++)
                $("<span>" + t.substr(i, 1) + "</span>")
                    .addClass("hidden")
                    .delay(i * 2000) /* this delay doesn't execute */
                    .addClass("visible")
                    .appendTo("#floatingName");

        });
});

请不要因为 d 是持续时间而 t 是标题而咬我的头。我缩写了这些名称，因为每个程序员都喜欢神秘的、非自我解释的、简短的变量名。对？说真的，我试图避免包装。

另外，我尝试在此处的 jsFiddle 上发帖，但该示例甚至没有闪烁屏幕，更不用说正确执行延迟了。

4

2 回答 2

2

animate() 的第二个参数是动画应该动画结束的时间。不是动画开始之前的时间。您应该在链中的每个 animate() 之间放置 delay() 。

$("body")
    .delay(flashDuration[0])
    .animate({ backgroundColor: "#888888" }).delay(d[1])
    .animate({ backgroundColor: "#222222" }).delay(d[2])

等等...

您还可以使用 animate() 的 queue 选项来使动画堆叠而不是立即运行。

所有解释在这里 http://api.jquery.com/animate/

编辑

延迟不会延迟脚本的执行，它只会延迟动画队列中的下一个项目。所以不能这样使用。您应该改用 setTimeout。

http://api.jquery.com/delay/

.delay() 方法最适合在排队的 jQuery 效果之间进行延迟。因为它是有限的——例如，它不提供取消延迟的方法——.delay() 不能替代 JavaScript 的本机 setTimeout 函数，这可能更适合某些用例。

于 2012-07-23T16:02:02.593 回答
2

据我所知，jQuery 本身仍然不支持彩色动画。

这是您在 jsFiddle 上的代码版本，其中包含彩色动画扩展：

http://jsfiddle.net/8XUpL/4/

于 2012-07-23T16:10:49.340 回答