Jquery,背景颜色过渡循环

时间:2010-08-30 00:30:45

标签: jquery gradient transition

我希望为背景颜色设置动画,以便在无限循环中循环通过varios预定义颜色。

我不是程序员,也不是jquery的新手,如果有人可以帮我解决这个问题我真的很感激ist

THX!

2 个答案:

答案 0 :(得分:2)

window.setInterval('functionToChangeColour()',5000);这将以每5000毫秒的速度运行您的函数,以您希望的方式更改颜色。

你可以指定一个对象var obj = setInterval('functionToChangeColour()',5000);如果你喜欢使用window.clearInterval(obj)

,那么稍后清除间隔

答案 1 :(得分:2)

以Byron的解决方案为基础并利用color animations plugin

// The array of colours and current index within the colour array
// This array can be hex values or named colours
var colours = ['red', 'orange', 'yellow', 'green', 'blue', 'purple'];
var currIndex = 0;

// The element to animage the background-color of
var elem = $('#element-id');

// Infinitely animate the background-color of your element every second
var loop = setInterval(function(){
    elem.animate({backgroundColor: colours[currIndex++]});

    // Set the current index in the colour array, making sure to loop
    // back to beginning once last colour is reached
    currIndex = currIndex == colours.length ? 0 : currIndex;
}, 1000);

你可以看到它in action here