• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabellenmenü mit JS und CSS

  • Ersteller Ersteller matibaski
  • Erstellt am Erstellt am
Status
Für weitere Antworten geschlossen.
M

matibaski

Guest
Moin!
Habe folgendes:
Ich mache eine navigation für eine Webseite.
Ichhabe in der CSS einen Standart gesetzt für Schriftfarbe, grösse usw..
Dann habe ich in einem Div eine Tabelle eingesetzt, in der das Menü kommt.

Die Standartschriftfarbe ist weiss (schwarzer Hintergrund) und bei Hyperlinks ist Standart weiss und unterstrichen.
Ach, seht hier einfach:
Code:
/* Allg. Formatierungen */
body {
margin: 0px;
font-size: 10px;
font-family: Verdana, Arial;
color: #ffffff;
background-color: #000000;
}
Nun mahce ich ein Tabellenhover mit JS. Wenn man drüberscrollt, erscheint eine Fabre als Hintergrund bei allen <tr>'s.

Doch wenn ich dann auf einen Link gehe, erscheint ein Block. Also schrift ist weiss und hintergrund auch, obwohl ich eine ID angegeben habe, die eine Formatierung hat.
Seht her:
Code:
/* allg. Links */
a:link, a:visited, a:active {
color: #ffffff;
text-decoration: underline;
}

a:hover {
color: #000000;
text-decoration: none;
background: #ffffff;
}

/* Menü */
#menu a:link, #menu a:active, #menu a:visited {
text-decoration: underline;
color: #ffffff;
}

#menu td a:hover {
text-decoration: none;
color: #ffffff;
background-color: #779fd2!important;
}
Hier sind die allgemeinen Links und das Menü

Mein script sieht so aus:
Code:
<script type="text/javascript">
function ein(x) {
 document.getElementById(x).style.backgroundColor="#779fd2";
 document.getElementById(x).style.color="#000000";
}
function aus(x) {
 document.getElementById(x).style.backgroundColor="transparent";
 document.getElementById(x).style.color="";
}
</script>
Und heir meine Tabelle:
HTML:
 <div id="left">
  <table cellspacing="0" style="margin:5px; border:1px solid #779fd2;">
   <tr id="1" onMouseOver="ein('1');" onMouseOut="aus('1');">
    <td style="padding:5px; width: 199px;" id="menu"><a href="index.php?site=home" id="menu">Home</a></td>
   </tr>
  </table>
Es stimmt alles mit dem Tabellenhover.
Aber ich möchte, dass, wenn man auf einen Link geht, (wenn das Tabellenhover bei einem TR aktiv ist), dass die Schrift schwarz wird und kein hintergrund.

Ich hoffe, ihr habt es verstanden. Ist ziemlich viel Text.

MfG, matibaski

edit:
Frage vergessen!
Wie muss ich den JS Code schreiben, dass es nicht unterstrichen wird und dass die Schriftfabr schwarz wird, wenn ich auf eine Zeile gehe. (Text muss schwarz werden)
 

Anhänge

  • test.png
    test.png
    2 KB · Aufrufe: 7
Zuletzt bearbeitet von einem Moderator:
Status
Für weitere Antworten geschlossen.
Zurück
Oben