Switch bgd color every X seconds
by Marventus
HTML
<div class="container"></div>
CSS
div {
background-color: red;
height:500px;
-webkit-transition: background-color 0.5s ease-in-out;
-moz-transition: background-color 0.5s ease-in-out;
-o-transition: background-color 0.5s ease-in-out;
-khtml-transition: background-color 0.5s ease-in-out;
transition: background-color 0.5s ease-in-out;
}
JavaScript
jQuery(function ($) {
function changeColor(selector, colors, every) {
/* Params:
* selector: string,
* colors: array,
* every: integer (in mili-seconds)
*/
var curCol = 0,
timer = setInterval(function () {
if (curCol === colors.length) curCol = 0;
$(selector).css("background-color", colors[curCol]);
curCol++;
}, every);
}
$(window).load(function () {
changeColor(".container", ["green", "yellow", "blue", "red"], 3000);
});
});