This is a simple random colour generator thinger written with jQuery. Honestly I can’t think of too many cases where you’d need such a thing, but it’s still pretty sweet. It’s probably better to have it generate a random colour once/on command, instead of at a set interval.
Demo
Become mesmerized by the changing colours
The Code
Download Colourific (v1.0 – January 2008)
Don’t forget that you’ll also need to download jquery to use this script!
/* -- jQuery Colourific */
/* -- v 1.0 - January 2008 */
/* -- by ben watts (http://www.benwatts.ca/sandbox/jquery-colourific/) */
$(document).ready(function(){
setupColourific();
});
// setupColourific
function setupColourific(){
var elementToChange = $("h4.colourchange"); // the element that's changing
changeColour(elementToChange);
window.setInterval( function(){changeColour(elementToChange)}, 2000);
}
// changeColour
function changeColour(e){
// random values between 0 and 255, these are the 3 colour values
var r = Math.floor(Math.random()*256);
var g = Math.floor(Math.random()*256);
var b = Math.floor(Math.random()*256);
// puts the hex value inside this element (e is a jquery object)
e.text(getHex(r,g,b));
// change the text colour of this element
e.hide().css("color", getHex(r,g,b)).fadeIn("fast");
}
// intToHex()
function intToHex(n){
n = n.toString(16);
// eg: #0099ff. without this check, it would output #099ff
if( n.length < 2)
n = "0"+n;
return n;
}
// getHex()
// shorter code for outputing the whole hex value
function getHex(r, g, b){
return '#'+intToHex(r)+intToHex(g)+intToHex(b);
}