jQuery Change Div Background Color Randomly or Website

By: Suresh Dasari Dec 11, 2012

Introduction:

Here I will explain how to change background color of website or div randomly using jQuery.

Description:

In previous articles I explained jQuery Show Subscribe modal popup for website, jQuery Convert uppercase to lowercase, Get latest or recent tweets using jQuery, jQuery get cursor position and many articles relating to JQuery and asp.net. Now I will explain how to change background color of website or div randomly using jQuery.

To implement this functionality we need to write the following code in your page

<title>Untitled Page</title>

$(document).ready(function() {

changecolor();

});

function changecolor() {

var colors = ["#00FF00", "#CCCCCC", "#990099", "#FEA400", "#FF9900", "#6600FF", "#333333", ];

var rand = Math.floor(Math.random() * colors.length);

$('#controls-wrapper').css("background-color", colors[rand]);

setTimeout('changecolor()', 1000);

}

</script>

</head>

<body>

<p>

Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com

</p>

</div>

</form>

</body>

</html>

Live Demo

Check below div for live demo

Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com Welcome to Aspdotnet-Suresh.comWelcome to Aspdotnet-Suresh.com