<style>
.menulines{
border:2.5px solid #F0F0F0;
}
.menulines a{
text-decoration:none;
color:black;
}
</style>
<script language="JavaScript1.2">
//3-state Highlight menu effect script: By Dynamicdrive.com
//For full source, Terms of service, and 100s DTHML scripts
//Visit http://www.dynamicdrive.com
function over_effect(e,state){
if (document.all)
source4=event.srcElement
else if (document.getElementById)
source4=e.target
if (source4.className=="menulines")
source4.style.borderStyle=state
else{
while(source4.tagName!="TABLE"){
source4=document.getElementById? source4.parentNode : source4.parentElement
if (source4.className=="menulines")
source4.style.borderStyle=state
}
}
}
</script><table border="0" width="200"
cellspacing="0" cellpadding="0"
onMouseover="over_effect(event,'outset')"
onMouseout="over_effect(event,'solid')"
onMousedown="over_effect(event,'inset')"
onMouseup="over_effect(event,'outset')"
style="background-color:#F0F0F0">
<tr><td width="100%" bgcolor="#E6E6E6"><font
face="Arial" size="3"><b>Main
Menu</b></font></td></tr>
<tr><td width="100%" class="menulines"><font
face="Arial" size="2"><a
href="http://wsabstract.com">Website
Abstraction</a></font></td></tr>
<tr><td width="100%" class="menulines"><font
face="Arial" size="2"><a
href="http://freewarejava.com">Freewarejava.com</a>
</font></td></tr>
<tr><td width="100%" class="menulines"><font
face="Arial" size="2"><a
href="http://freewarejava.com/cgi-bin/Ultimate.cgi">Webmaster Help
Forum</a> </font></td></tr>
<tr><td width="100%" class="menulines"><font
face="Arial" size="2"><a
href="http://www.slashdot.com">SlashDot</a></font></td></tr>
<tr><td width="100%" class="menulines"><font
face="Arial" size="2"><a
href="http://www.msnbc.com">MSNBC.com</a>
</font></td></tr>
</table>
Configuring the menu
The code of Step 2 illustrates what must be done to a
standard table to have the effect applied to its cells. Firstly, have present the
onMouse...code inside the <table> tag itself, as follows:
<table onMouseover="over_effect(event,'outset')"
onMouseout="over_effect(event,'solid')"
onMousedown="over_effect(event,'inset')"
onMouseup="over_effect(event,'outset')"
style="background-color:#F0F0F0">
Secondly and finally, for each of the table cells
(<td>) that you wish the effect to be added to, add the class=... code inside it:
<td class="menulines">.......</a>
Viola! |
