This shows how to have popups with different color backgrounds.

Head Code:

<STYLE TYPE="text/css">
BODY {OVERFLOW:scroll;OVERFLOW-X:hidden}
.DEK {POSITION:absolute;VISIBILITY:hidden;Z-INDEX:200;}
</STYLE>

Body Code:

<DIV ID="dek" CLASS="dek"></DIV>
<SCRIPT TYPE="text/javascript">
<!-- Original:  Mike McGrath   (mike_mcgrath@lineone.net) -->
<!-- Web Site:  http://website.lineone.net/~mike_mcgrath/ -->


Xoffset=-60;    // modify these values to ...
Yoffset= 20;    // change the popup position.

var nav,old,iex=(document.all),yyy=-1000;
if(navigator.appName=="Netscape"){(document.layers)?nav=true:old=true;}

if(!old){
var skn=(nav)?document.dek:dek.style;
if(nav)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=get_mouse;
}

function popup(msg,bak){
var content="<TABLE  WIDTH=130 BORDER=1 BORDERCOLOR=black CELLPADDING=2 CELLSPACING=0 "+
"BGCOLOR="+bak+"><TD ALIGN=center><FONT COLOR=black SIZE=2>"+msg+"</FONT></TD></TABLE>";
if(old){alert(msg);return;} 
else{yyy=Yoffset;
 if(nav){skn.document.write(content);skn.document.close();skn.visibility="visible"}
 if(iex){document.all("dek").innerHTML=content;skn.visibility="visible"}
 }
}

function get_mouse(e){
var x=(nav)?e.pageX:event.x+document.body.scrollLeft;skn.left=x+Xoffset;
if(nav)var y=e.pageY;
if(iex){y=event.y;if(navigator.appVersion.indexOf("MSIE 4")==-1)y+=document.body.scrollTop}
skn.top=y+yyy;
}

function kill(){
if(!old){yyy=-1000;skn.visibility="hidden";}
}


</SCRIPT>

<!-- END OF STEP TWO ------------------------------------------------->

<CENTER>
<TABLE BORDER="0" CELLPADDING=40 CELLSPACING=0 SUMMARY="holder">
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','beige')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','lavender')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','aquamarine')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A></CENTER>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','mistyrose')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A></CENTER>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','beige')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','lavender')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','aquamarine')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A></CENTER>
</TD></TR>
<TR><TD ALIGN="center">
<A HREF="javascript://" ONMOUSEOVER="popup('Javascript Popups by Mike McGrath','mistyrose')"; ONMOUSEOUT="kill()"><font color="black"><b>MOUSEOVER HERE</b></font></A></CENTER>
</TD></TR>

</TABLE>
</CENTER>

Times Viewed: 3