Page 1 of 1
[Solved] Random BG Colors for DIV
Posted: Fri Jan 27, 2012 10:01 am
by techkid
I want to give the div random background colors every time the page loads, and I want to specify those colors as well. Anyone has an idea?
I don't want the same color to appear on the same div every time.
Suppose I want 3 colors, and I have 3 div classes. How can I do it? I found few jQuery codes which can do the function, but the problem is, the same color appears on the same div when the page is reloaded.
Re: Random BG Colors for DIV
Posted: Fri Jan 27, 2012 10:11 am
by Celauran
Show us the code you're using and we'll see what we can do from there.
Re: Random BG Colors for DIV
Posted: Fri Jan 27, 2012 12:45 pm
by techkid
Here's what I have used so far. The issue with this is, all the div element has same color, Instead I want to display different colors.
Code: Select all
<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.min.js"></script>
</head>
<body>
<div class="controls-wrapper">some text</div>
<div class="controls-wrapper">some text</div>
<div class="controls-wrapper">some text</div>
<div class="controls-wrapper">some text</div>
<div class="controls-wrapper">some text</div>
</body>
<script>
$(document).ready(function(){
var colors = ["#CCCCCC","#333333","#990099"];
var rand = Math.floor(Math.random()*colors.length);
$('.controls-wrapper').css("background-color", colors[rand]);
});
</script>
</html>
Re: Random BG Colors for DIV
Posted: Fri Jan 27, 2012 12:50 pm
by Celauran
Code: Select all
$(document).ready(function(){
var colors = ["#CCCCCC","#333333","#990099"];
$('.controls-wrapper').each(function() {
var rand = Math.floor(Math.random()*colors.length);
$(this).css("background-color", colors[rand]);
});
});
Re: Random BG Colors for DIV
Posted: Fri Jan 27, 2012 12:52 pm
by techkid
Thanks, works well.