Mega Code Archive

 
Categories / JavaScript DHTML / HTML
 

Layer Background Colors (W3C)

/* JavaScript Bible, Fourth Edition by Danny Goodman  John Wiley & Sons CopyRight 2001 */ <HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function setColor(evt) {     evt = (evt) ? evt : (window.event) ? window.event : ""     if (evt) {         var elem = (evt.target) ? evt.target : evt.srcElement         if (elem.className == "palette") {             document.getElementById("display").style.backgroundColor = elem.style.backgroundColor         }     } } document.onmouseover = setColor </SCRIPT> </HEAD> <BODY> <H1>Layer Background Colors (W3C)</H1> <HR> <SCRIPT LANGUAGE="JavaScript"> var oneLayer var colorTop = 100 var colorLeft = 20 var colorWidth = 40 var colorHeight = 40 var colorPalette = new Array("aquamarine","coral","forestgreen",                    "goldenrod","red","magenta","navy","teal") for (var i = 0; i < colorPalette.length; i++) {     oneLayer = "<DIV ID='swatch" + i + "' CLASS='palette'"     oneLayer += "STYLE='position:absolute; top:" + colorTop + ";"     oneLayer += "left:" + ((colorWidth * i) + colorLeft) + ";"     oneLayer += "width:" + colorWidth + "; height:" + colorHeight + ";"     oneLayer += "background-color:" + colorPalette[i] + "'></DIV>\n"     document.write(oneLayer) } </SCRIPT> <DIV ID="display" STYLE="position:absolute; top:150; left:80; width:200; height:200; background-color:gray"> <SPAN STYLE="font-weight:bold; color:white; text-align:center"> Some reversed text to test against background colors.</SPAN> </DIV> </BODY> </HTML>