|
FAQ de.comp.lang.javascript |
|
Bitte verwenden Sie als Einstiegsadresse in diese FAQ die
Homepage der Newsgroup de.comp.lang.javascript.
Der Aufenthaltsort dieser Seiten hier kann sich ohne Vorwarnung ändern.
Ändern läßt sich die Hintergrundfarbe einer Tabellenzelle bei allen genannten Browsern (bei älteren haben Sie natürlich keine Chance). Das Problem besteht lediglich darin, dass wegen der vollkommen unterschiedlichen Objektmodelle jeder "eine persönliche Anrede" haben möchte. MSIEs und Netscape 6 gestatten es ohnehin, jede Zelle anzusprechen, am geschicktesten über id. Für Netscape 4 muß man dafür sorgen, dass die Zelle durch ein Layer-Objekt repräsentiert wird, also positionieren:
<td id="Zelle4" style="position:relative">hier steht was</td>
Dann kommt man an die Hintergrundfarbe der Zelle (des Layers) so:
Das folgende Beispiel zeigt das Prinzip (Dankeschön übrigens an Wolfgang Schwarz; von ihm ist das Beispiel, er hat es oft genug in der Newsgroup gepostet.):
Zum Ausprobieren:
viel Holz | |
wenig Holz |
Das Skript:
<script language="JavaScript" type="text/javascript"> <!-- function wxlBgCol(id,farbe) { if (document.all) document.all[id].style.backgroundColor=farbe; else if (document.getElementById) document.getElementById(id).style.backgroundColor=farbe; else if (document.layers) document.layers[id].bgColor=farbe; } //--> </script>
Die Tabelle:
<table border=1> <tr> <td id="Zelle1" style="position:relative" bgcolor="white"> <a href="javascript:void(0)" onMouseOver="wxlBgCol('Zelle1','maroon')" onMouseOut="wxlBgCol('Zelle1','khaki')">viel Holz</a> </td> <td> </td> </tr> <tr> <td> </td> <td id="Zelle4" style="position:relative" bgcolor=white"> <a href="javascript:void(0)" onMouseOver="wxlBgCol('Zelle4','seashell')" onMouseOut="wxlBgCol('Zelle4','black')">wenig Holz</a> </td> </tr> </table>
Diese Seite ist Teil der de.comp.lang.javascript FAQ. Die Einstiegsadresse lautet http://www.dcljs.de/.
Dieser Text wurde erstellt von Christine Kühnel (©).
© S. Mintert, Ch. Kühnel
______ letzte Änderung: 01.01.2002 ______
Original-URL dieser Datei: http://dcljs.de/faq/antwort.php?Antwort=dhtml_tabellenhintergrund