Lukas Hänel: Hintergrundfarbe in Tabellenzellen ändern

Beitrag lesen

Hallo Wolfgang

  1. Komplette Zeile als Link:
    -sinnvollste Lösung: die weite des Links mit Stylesheet auf 100% setzen.
    -idiotische Lösung, die manche Programme anbieten: für jeden td Tag auch noch einen Onclick handler eingeben, der wie der Link die Seite ändert, mit location.href='neue Addresse'

2.Hintergrund ändern:
-bei wenigen Zellen/hoher Kompatibilität/geringer JavaScript Erfahrung:
für jeden td die zwei handler notieren und dann jeweils onMouse___="this.style.backgroundColor='farbangabe'"
-alternativ, d.h. weniger Text, aber inkompatibler kann man auch eine Funktion aufrufen, a lá onMouse___="chgColor(0 oder 1)" und dann im script bereich die funktionen definieren, und als inhalt z.B. event.srcElement.style.color= para ? "red" : "blue"; bzw. e.target.style... für NS6.
-bei sehr vielen Zellen/besserer Javascript erfahrung,
nichts in die TDs reinschreiben, sondern im Script eine Funktion schreiben, die mit document.onmouseover=makeHover; aufgerufen wird.
Dann abfragen, ob das Element ein TD Tag ist, (.nodeName="TD") und wenn es ein Link ist, überprüfen, ob das übergeordnete Element eine TD ist. (.parent.nodeName). Wenn du innerhalb der Zellen noch weitere Elemente hast, solltest du aber eine Schleife schreiben, die sich hocharbeitet und bei body aufhört. Dann wie gehabt mit .style die Farbe ändern und dann einen handler für den onmouseout zu dem TD hinzufügen, mit .onmouseout=delHover; Wichtig, keine Klammern hinter den Funktionsnamen. die Funktion delHover muss dann die Farbe wieder ändern und löschen, dass sie selbst aufgerufen wird: VariableVonmakeHover.onmouseout="";
Hab ich was vergessen... Ach ja die dritte Variante ist einem Script von http://www.dynamicdrive.com entnommen