Hover-Effekt auf Tabellen anwenden
Andreas
- css
0 Julian Hofmann0 Kai Lahmann0 Dilbert
Hallo
Ab und an sehe ich im Internet Links, die so gestaltet sind, dass sich als Hover-Effekt die Hintergrundfarbe einer Tabellenzelle ändert.
Auf SelfHTML läßt sich kein Script finden, mit dem dieser Effekt realisierbar ist.
Meine Hoffnung ist, das sich das Problem mit CSS lösen läßt. Meine bisherigen versuche haben nix erbracht.
Wer weiß wie es geht und kann helfen ???
Vielen Dank. Andreas
Hallo,
Auf SelfHTML läßt sich kein Script finden, mit dem dieser Effekt realisierbar ist.
SelfHTML möchte ja auch nicht fertige Lösungen bieten, sondern die Anleitung zum Self-tun geben - und soweit steht es in SelfHTML drin.
Mit folgenden zwei Aktionen im table, tr oder td sollte es klappen:
onmouseover="this.style.backgroundColor='#0066CC'"
onmouseout="this.style.backgroundColor='#CCCCCC'"
Evtl. ist ein onClick-Event bei Links noch anzuraten um die ganze Fläche mit Verknüpfung zu belegen.
Grüße aus Würzburg
Julian
hi
Ab und an sehe ich im Internet Links, die so gestaltet sind, dass sich als Hover-Effekt die Hintergrundfarbe einer Tabellenzelle ändert.
tjo.. wenn die Browser nicht so verbuggt wäre... mit td.hoverzelle:hover{background-color:was_anderes;} würde es nach der CSS2-Spec gehen (dabei bekommen die Zellen, wo es aufteten soll ein class="hoverzelle". Tatsächlich rallt das so nur konqueror, bei Mozilla klappt's nur, wenn man neben (!) dem Text ist der Rest rallt's gleich gar nicht. Was aber geht ist, wenn du den Link mit "display:block;" in CSS auf die komplette Zelle ausdehnst.
Ansonsten geht das ganze über JS evtl. etwas einfacher (dafür aber eben nimma, wenn man's abstellt): onmouseover="this.style.backgroundColor='farbe';" onmouseout="this.style.backgroundColor='altefarbe';"
gruss Kai
Meine Hoffnung ist, das sich das Problem mit CSS lösen läßt. Meine bisherigen versuche haben nix erbracht.
Hallo Andreas,
falls Du NS4 ausschließt, kann vielleicht folgender Link
http://selfaktuell.teamone.de/artikel/css/mouseover/index.htm
helfen. Da sind auch einige Betrachtungen über Browserkompatibilität.
Ansonsten bleibt Dir nur die JS Variante, die die anderen schon
erwähnt haben.
Gruß
Dilbert