jquery - 在 jquery 中创建循环背景动画

Question

我想要的是：

当页面加载时 - 背景在 10 秒后变为红色，bgColor 变为绿色并带有淡入淡出动画......再过 10 秒后它变为橙色......然后再次变为红色，依此类推..

有人可以帮忙吗

Answer 1

将setinterval与更改背景的回调一起使用：

$("document").ready(function() {
    var colours = [ "blue", "orange", "pink" ];
    var counter = 0;
    function cycleBackground() {
        $("body").animate({ backgroundColor: colours[counter] }, 500 );
        counter++;
        if(counter == colours.length) {
            counter = 0;
        }
    }
    setInterval(cycleBackground, 10000);
});

如果要在颜色之间平滑循环，则需要使用 jQuery UI 的动画功能。