In CSS events mit Funktionen belegen
Lobordan
- dhtml
0 Curt
Also, zuerst einmal VIELEN DANK für dieses absolut geniale Kompendium!
Nun zu meiner Frage: Ich habe eine Homepage für unseren Clan (http://www.world-of-kys.de) erstellt. Auf dieser Homepage sind diverse Tabellen. Nun habe ich zwei funtionen (highlight(sender) und lowlight(sender) ) geschrieben, die den Hintergrund einer Zeile hervorheben, wenn man mit der Maus über dieser Zeile ist. Bisher muß ich dafür für jede Zeile einzeln das onMouseOver und onMouseout-Ereignis definieren. Geht das auch per CSS als Standard für alle Zeilen?
Danke im vorraus
mfg Lobordan
Hi Lobordan,
Kann dir auf die schnelle ne Lösung für den IE anbieten, ist dort nicht alzu schwer.
<script langugae="JavaScript">
function highlite(Ereignis) {
event.srcElement.style.backgroundColor = "#fe9083";
}
function lowlite() {
event.srcElement.style.backgroundColor = "#ffffff";
}
</script>
<table border="1" cellpadding="0" cellspacing="0" onmouseover="highlite()" onmouseout="lowlite()">
<tr>
<td>Hallo</td>
<td>hallo</td>
</tr>
</table>
Du musst keineswegs die beiden eventhandler in jeder Zelle notieren, es reicht wenn du diese für die Tabelle definierts, den folgendes:
beim IE tritt das ereignis mouseover immer in der Tabellenzelle wenn du mit der maus drübergehst (genauer genommen findet das ereignis sowieso die ganze Zeit statt bei allen Element, du merkst es bloss erst dann wenn du darauf reagierts). Wenn dort ein eventhandler notiert ist wird dieser ausgelöst, wenn nicht passiert dort erstmal nichts. Nun kommt ne andere Sache ins spiel, die nennt sich eventbubbling, d.h. das ereignis durchläuft aufsteigend das ganze dokument, also vom td zum tr zum table zum body, du kannst es an jeder stelle abfangen je nach dem wo du deine eventhandler setzt. Deswegen kannst du _alle_ mouseover-Ereignis im table abfangen.
puuuhh, ist etwas lang geworden.
Also, beim IE wird durch das ereignis ein event-Objekt erstellt, mit dem kannst du auch herausfinden wer ursprünglich für das Äuslösen des Ereignisses verantwortlich war, ...
So genug, wichtiger Hinweis, das ganze funktioniert so nicht im NN, für NN 4.x wirds eh sehr schwierig das umzusetzen (lass es liebr), für den NN 6.x kein Problem, nur gehts dort etwas anders, am besten in SELFHTML nachlesen, dort steht noch alles was du brauchst.
gruss
Curt