Axel Richter: onmouseout verhindern ohne neu zu laden

Beitrag lesen

Hallo,

ich habe eine Tabelle, und immer wenn man mit der Maus über eine Zeile fährt bekommt die eine bestimmte Hintergrundfarbe, und wenn man die Zeile verlässt kommt wieder die alte Farbe. Das mache ich so:

<tr onmouseover="this.className = 'hoverlines-in'" onmouseout="this.className = 'hoverlines-out'">

Bist Du sicher, dass dieser Klassentausch immer und überall funktioniert? Warum setzt Du die gewünschten Style-Eigenschaften nicht jeweils in einer JavaScript-Funktion?

Jetzt will ich aber, wenn man in der Zeile auf einen Link klickt, dass ohne die Seite neu zu laden(!) onmouseout keinen Effekt mehr hat, also sobald man geklickt hat bleibt die Farbe, auch wenn man mit der Maus die Zeile verlässt.

Wie kann ich das erreichen?

Indem man bei onclick die Eigenschaft onmouseover auf NULL setzt.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Mouseover</title>
</head>
<body>
<table >
<tr>
 <td style="background-color:#00AEAD;" onmouseover="this.style.backgroundColor='#FF7D7B';" onmouseout="this.style.backgroundColor='#00AEAD';" onclick="this.onmouseout=null;">Tabellenzelle</td>
</tr>
</table>
</body>
</html>

viele Grüße

Axel