WP-Mix

A fresh mix of code snippets and tutorials

Random colors with JavaScript

Here is an old script that’s just too precious to throw away, so here it is for the sake of reference and utter amusement.

Just add this slab of code to any HTML file:

<script type="text/javascript">
function switchBGColor(elemID) {
	var rgbColor = '';
	for (i=1; i<4; i++) {
		rgbColor += Math.floor(Math.random() * (250+1));
		if(i!=3) rgbColor += ',';
	}
	document.getElementById(elemID).style.background="rgb("+rgbColor+")";
}
function switchColor(elemID) {
	var rgbColor = '';
	for(i=1; i<4; i++) {
		rgbColor += Math.floor(Math.random() * (250+1));
		if(i!=3) rgbColor += ',';
	}
	document.getElementById(elemID).style.color="rgb("+rgbColor+")";
}
</script>

<table style="text-align:center;">
	<tr height="111">
		<td id="1" style="background:red;" onmouseover="switchBGColor('1');" width="111">
			<h1 id="a" style="color:white; font-size:48px;" onmouseover="switchColor('a');">m</h1>
		</td>
		<td id="2" style="background:blue;" onmouseover="switchBGColor('2');" width="111">
			<h1 id="b" style="color:white; font-size:48px;" onmouseover="switchColor('b');">0</h1>
		</td>
		<td id="3" style="background:green;" onmouseover="switchBGColor('3');" width="111">
			<h1 id="c" style="color:white; font-size:48px;" onmouseover="switchColor('c');">n</h1>
		</td>
		</tr>
		<tr height="111">
			<td id="4" style="background:yellow;" onmouseover="switchBGColor('4');" width="111"></td>
			<td id="5" style="background:purple;" onmouseover="switchBGColor('5');" width="111"></td>
			<td id="6" style="background:orange;" onmouseover="switchBGColor('6');" width="111"></td>
		</tr>
</table>

★ Pro Tip:

SES Pro