创建jQuery中一个循环的背景动画 [英] Creating a looping background animation in jquery

问题描述

我要的是：

10秒后，BGCOLOR变为绿色淡入淡出动画...
再过10秒，变为橙色....然后再以红色和后等..

when the page loads - the background has color red after 10 seconds the bgColor changes to green with a fade in fade out animation... after another 10 seconds it changes to orange....then again to red and so on..

有人能帮助

推荐答案

使用的setInterval 与该改变背景回调：

Use setinterval with a callback that changes the background:

$("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用户界面的如果要颜色之间的平滑周期动画功能。

You will need to use jQuery UI's animate function if you want to smoothly cycle between colors.

这篇关于创建jQuery中一个循环的背景动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！