random pixel header

For this website I used some jQuery to randomize pixel that are used to generate the header and the footer. On reload every pixel gets a new color out of an array. Each (10 by 10 px) div in the header and footer with the class .rand gets a new background-color out of the array.  The random number comes out of the Math.floor function from jQuery. The function creates one value between 0 and 8 each loop. If you only have 5 colors in your array, you should use (Math.random()*5)

$(document).ready(function() {
	$('.rand').each(function () { 

		var colors = Array("#f8e9be","#f1d292", "#d2b280", "#a98052", 
                       "#4b3528", "#944537", "#bbac85", "#c08752", "#6b4937");
		var rand = Math.floor(Math.random()*9);

			$(this).css('background-color', colors[rand]);

	});
});

 

 

Pretty simple, ehh?!

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.