ERLEDIGT
NEIN
NEIN
ANTWORTEN
6
6
ZUGRIFFE
622
622
EMPFEHLEN
-
Hallo,
ich habe mit CSS eine Klasse namens #mininav gemacht, die ich mittels eines DIV Elements aufrufe. Nun möchte dieser Klasse (sorry, falls ich falsche Namen benutze, bin noch neu bei CSS) einen Hover zuweisen. Praktisch das #mininav einen Hover effekt hat, der die Farbe ändert. Hier der Quellcode:
#mininav {
height: 20px;
width: 300px;
margin-left: 701px;
background-color: #FF9900;
margin-top: 0px;
border-left-width: 1px;
border-right-width: 0px;
border-top-width: 0px;
border-bottom-width: 0px;
color: #FFFFFF;
font-family: Arial,sans-serif;
padding-left: 3px;
}
und hier das DIV Element:
<div id="mininav">CSS since 2004</div>
Wie kann ich nun einen Hover Effekt machen?
Vielen Dank schonmal im Vorraus!
Mfg
chellGeändert von chell (05.09.04 um 15:05 Uhr)
-
05.09.04 14:59 #2
- Registriert seit
- Dec 2001
- Beiträge
- 3.078
Einen CSS-Hover-Effekt kann man meines Wissens nur bei Links machen. Du kannst aber z. B. mit dem JavaScript-Event-Handler onmouseover/onmouseout arbeiten.
-
Vielen Dank für deine schnelle Antwort. Hast du vielleicht (oder hast du) zufällig den Code dafür/eine Seite wo das erklärt wird?
Mfg
chell
-
05.09.04 15:07 #4
- Registriert seit
- Dec 2001
- Beiträge
- 3.078
SELFHTML: onmouseover
SELFHTML: onmouseout
Das sollte fürs erste reichen. Einfach mal ein bisschen ausprobieren, du kriegst das bestimmt hin.
Und wenn konkrete Probleme auftauchen, kannst du dich ja jederzeit wieder hier melden. 
-
Sorry, aber ich steige da überhaupt nicht durch, zumal ich absolut keine Ahnung von JS habe. Gibt es da keine andere Lösung? Ich habe mal was von pseudo klasse gehört, aber ich glaube das hilft mir auch nicht, oder?
Mfg
chell
-
Es geht dabei um die Pseudoklasse " :hover ", eine klasse die nur aufgerufen wird wenn man mit der maus darüber fährt wie bei a:hover
Das würde alles wunderbar funktionieren, wäre da nicht der Internet Explorer der meint :hover könnte man nur auf <a> tags beziehen und nicht wie eigentlich geplant auf andere sachen wie <div> usw
daher ( vorrausgesetzt man will dass es für den IE auch funktioniert ) muss man das mit javascript machen, was etwa so aussieht
Code :1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
<head> <title>Hover test</title> <style type="text/css"> <!-- td.test { border: 5px solid red; color: black; background: cyan; padding: 50px; } td.test2 { border: 5px solid yellow; color: white; background: black; padding: 50px; } --> </style> </head> <body> <table> <tr><td class="test" onmouseover="this.className='test2'" onmouseout="this.className='test'">Hello world!</td></tr> </table> </body>
hf
-
07.09.04 19:19 #7
- Registriert seit
- Dec 2001
- Beiträge
- 3.078
D'oh, I'm sorry, das wusste ich nicht! Aber man lernt ja glücklicherweise nie aus!Das würde alles wunderbar funktionieren, wäre da nicht der Internet Explorer der meint :hover könnte man nur auf <a> tags beziehen und nicht wie eigentlich geplant auf andere sachen wie <div> usw
Ähnliche Themen
-
CSS hover
Von Blinchik im Forum CSSAntworten: 5Letzter Beitrag: 03.02.10, 21:35 -
Hover
Von loonp im Forum WerkstattAntworten: 3Letzter Beitrag: 11.11.08, 20:44 -
Hover Menü und Bild Hover
Von GFENONO im Forum CSSAntworten: 9Letzter Beitrag: 05.12.07, 17:18 -
hover bei tr
Von crotalus im Forum CSSAntworten: 1Letzter Beitrag: 27.10.06, 12:28 -
A:hover ungleich a:hover
Von CvH im Forum CSSAntworten: 9Letzter Beitrag: 17.06.02, 12:08
Login
