Zellenhintergrund bei mouseover ändern
-
Hallo
Wie kann ich den Hintergrund (weiss zu schwarz z.B.) von einer Zelle in einer Tabelle bei mouseover ändern?
Also so wie hier die Navigation: http://www.lan-sinn.de/Gibt es eine Möglichkeit, das auch ohne JavaScript zu machen? Wenn ja, gibt es irgendwo ein Tutorial dazu oder kann mir das einer bitte sagen?
-
td :hover {
background-color:rgb(255,0,0);
}btw: Wenn du schon ein Beispiel hast, kannst du das doch einfach da abgucken, wozu gibts denn "View -> Source"?
[ Dieser Beitrag wurde am 17.04.2003 um 14:05 Uhr von Loggy editiert. ]
-
@Loggy
Danke, werde das gleich ausprobieren.
Bei meinem Beispiel ist das Script extern gelagert.
-
Ich habe das jetzt so gemacht, allerdings gibt es einen Fehler:
<SCRIPT language=JavaScript>
<!--
td :hover {
background-color:rgb(255,0,0);
}
-->
</SCRIPT>Vor der geschwungenen Klammer erwartet er einen Semikolon
-
ARGGHH
td :hover {
background-color:rgb(255,0,0);
}ist doch CSS und kein JavaScript !!!
-
Achso...
Ich habe das jetz so:
<td width="150" bgcolor="FFFFFF">
<a href="">- Link1</a>
</td>Und im Head das CSS.
Es wird aber nur der Link mit einer anderen Hintergrundfarbe gefärbt.
Und nicht die ganze Zelle. Kann ich auch die ganze Zelle irgendwie als Link nehmen, ohne alles mit ausfüllen zu müssen?[ Dieser Beitrag wurde am 17.04.2003 um 16:15 Uhr von Trunxx editiert. ]
-
Achja, ein css-Script kannst du dir auch ansehen wenn es extern gelagert ist. Such im Quellcode nach der Datei und gib sie einfach direkt in die Adressleiste ein - Enter und Fertig.
MfG SideWinder
-
Danke Side, aber das hilft mir leider nicht weiter.
Hab immer noch das "Problem" wie in meinem letzten Post beschrieben.
-
In deinem Beispiel ist das mit JavaScript gemacht.
Mit CSS geht es auch, nur fällt mir im Moment nur die Möglichkeit ein, dass du das <a> Element um ein <div> baust und darin den Text packst. Dann sollte es auch mit dem hovern klappen.
Aber irgendwie muss es auch einfacher gehen, ich weiß nur im Moment nicht wie
-
Ist ONMOUSEOVER eigentlich JavaScript oder HTML? Bekommt man sowas durch den Validator?
MfG SideWinder
-
Ja, es handelt sich um HTML Attribute ( http://www.w3.org/TR/html401/interact/scripts.html#h-18.2.3 ), die auch durch den Validator kommen.
Der Attributwert ist dann natürlich JavaScript.
-
@loggy: ich glaube mit display:block; müsste es gehen
-
@Loggy: Danke für die Page - kann man eigentlich statt eines kombinierten ONMOUSEOVER/ONMOUSEOUT irgendwie anders erzählen, dass man nur bei ONMOUSEOVER den Hintergrund verändert haben will?
Denn sonst wird das elend lang - jede Menüzelle braucht dann ein ONMOUSEOVER und ein ONMOUSEOUT dann auch noch ein style"background-image".
MfG SideWinder
-
Dafür gibts die CSS Pseudoklasse :hover.
Und ja, dispaly:block; ist ja dann das gleiche, wie <div>.
[ Dieser Beitrag wurde am 18.04.2003 um 12:28 Uhr von Loggy editiert. ]
-
@loggy, wieso ist das das gleiche? Und wieso nennt man es eigentl. Pseudoklasse?
-
Kann ich die auch in style verwenden? Irgendwie funktioniert das nicht:
<TD style="width:160px; height:18px; background-image:url(bla); hover:url(otherbla)">
INHALT
</TD>MfG SideWinder
-
da musste aufpassen, da dies viele Explorer glaube ich noch nicht interpretieren
-
Ich glaube das geht auch nicht. Pseudoklassen musst du global festlegen.
Alle HTML Elemente sind ja im Prinzip gleich. Nur wurde für alle ein paar andere CSS Definitionen festgelegt. <div> z.B. hat dispaly:block;, <span> dagegen (und viele andere) hat display:inline;. Wenn du jetzt für ein <span> display:block; festlegst, hast du praktisch ein <div>.
:hover ist ja keine wirkliche Klasse, denn sie tritt ja nur unter bestimmten Umständen auf (wenn der User mit seinem Zeigegerät über das Element fährt). Also nannte man es Pseudo-Klasse.
[ Dieser Beitrag wurde am 18.04.2003 um 14:12 Uhr von Loggy editiert. ]