Hallo Forum
ich möchte bei meiner Nav zur besseren übersicht den aktuellen Link hervorheben. Möchte es über css und getElementbaId machen habe bis jetzt das in html Code:
Code
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<div class="e2" id="Layer6" style="position:absolute; left:362px; top:94px; width:598px; height:43px; z-index:5;">
<table height="43" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="bottom"><table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>[url='../site/unternehmen/untern_mitarbeiter.html']Mitarbeiter[/url]</td>
<td>[url='../site/unternehmen/untern_kontakt.html']Kontakt[/url]</td>
<td>[url='../site/unternehmen/untern_anfahrt.html']Anfahrt[/url]</td>
<td>[url='../site/unternehmen/untern_partner.html']Partner[/url]</td>
<td>[url='../site/unternehmen/untern_presse.html']Presse[/url]</td>
</tr>
</table></td>
</tr>
</table>
</div>
<script language="JavaScript">
document.getElementById('e2b1').classname = "e2left_hl";
</script>und das ist ein auszug meines css Code:
Code
/* Standardlinks */
a:link { color:#000000; text-decoration:none; }
a:visited { color:#000000; text-decoration:none; }
a:hover { color:#777777; }
a:active { color:#FF0000; }
/* links ebene 2 */
a.e2:link, a.e2:visited, a.e2:active {
color: #000000;
background-color: #FFCB11;
display: block;
font-weight: normal;
padding-top: 4px;
padding-right: 10px;
padding-bottom: 4px;
padding-left: 10px;
text-align: center;
text-decoration: none;
font-size: 11px;
border-top: 1px solid #FFC910;
border-right: 1px solid #FFC910;
border-left: 1px solid #FFC910;
}
a.e2:hover {
color: #40403A;
background-color: #FFB504;
display: block;
font-weight: normal;
padding-top: 4px;
padding-right: 10px;
padding-bottom: 4px;
padding-left: 10px;
text-align: center;
text-decoration: none;
font-size: 11px;
border-top: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
border-left: 1px solid #FFFFFF;
}
a.e2left:link, a.e2left:visited, a.e2left:active {
color: #000000;
background-color: #FFCB11;
display: block;
font-weight: normal;
padding-top: 4px;
padding-right: 10px;
padding-bottom: 4px;
padding-left: 10px;
text-align: center;
text-decoration: none;
font-size: 11px;
border-top: 1px solid #FFC910;
border-right: 1px solid #FFC910;
}
a.e2left:hover {
color: #40403A;
background-color: #FFB504;
display: block;
font-weight: normal;
padding-top: 4px;
padding-right: 10px;
padding-bottom: 4px;
padding-left: 10px;
text-align: center;
text-decoration: none;
font-size: 11px;
border-top: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
.e2left_hl {
color: #40403A;
background-color: #FFFF00;
display: block;
font-weight: normal;
padding-top: 4px;
padding-right: 10px;
padding-bottom: 4px;
padding-left: 10px;
text-align: center;
text-decoration: none;
font-size: 11px;
border-top: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
div.e2 {
background-color: #FFC910;
border: 1px solid #FFFFFF;
}Leider funktioniert getElem.. nicht
Was habe ich falsch gemacht?
Bin für alle Anregungen Dankbar
mfg
Harry
edit by ph0re: bitte code tags benützen! + verschoben