img + hover

Status
Nicht offen für weitere Antworten.

MadCrusher

Erfahrenes Mitglied
Hallo,

Ich wollte gerne ein Menü erstellen und habe dafür images...
Nun dachte ich ich kann den Hover effekt nutzen in dem ich
divs erstelle und das image als background definiere und nen
blank gif drüberleg und das verlinke.
Mit der hover-Klasse wollt ich dann das background img
austauschen.
Geht das oder welche Lösung gibt es sonst noch?
Wollte javascript etc umgehen...

Gruß
Crusher
 
Ganz einfach du gibst der Navigation in deinem html file eine id.

Das könnte so aussehen:

HTML:
<html>
<head>
<link rel="stylesheet" type="text/css" href="test.css">
</head>
<body>
<div id="navigation">
<div><a href="#">Home</a></div>
<div><a href="#">test</a></div>
</div>
</body>

und das CSS dazu würde z.b so aussehen, jetzt musst du das ganze natürlich noch anpassen usw.

Code:
#navigation div{
height: 20px;
width: 100px;
}
#navigation a {
padding:20px;
background: url(image.gif);
}
#navigation a:hover{
background: url(image_hover.gif);
}
 
Hi,

mein eigens für solche Fälle geschriebenes CSS-Tutorial CSS-Rollover dürfte dir da sicherlich weiterhelfen.

@HuRaHoRRe: Eine CSS-Navigation wird üblicherweise mit dem Listenelement ausgezeichnet, ansonsten wird der HTML-Code von der Divitis befallen. :suspekt:
 
Status
Nicht offen für weitere Antworten.
Zurück