CSS – Mousover Effekt erscheint nicht

[ooAlbert]

Hallo,

ich möchte ganz gern einen Mouseover Effekt über ein Bild haben das gleichzeitig ein Link ist. Jetzt hab ich mir die gängigen Vorgehensweisen für CSS angesehen aber der Effekt bleibt aus :/

Das was ich mit "Kopf4" angefangen habe soll später auf alle anderen "Köpfen" übertragen werden :) Dieses Div mit den Links liegt übrigens über einem anderen Div, das auch Bilder enthält, falls das wichtig ist.


<div >
<a ID="kopf1" href="#"><img src="kopf/kopf_z5_2b.gif" border="0" alt="Kopf1"></a>
<a ID="kopf2" href="#"><img src="kopf/kopf_z4_2b.gif" border="0" alt="Kopf2"></a>
<a ID="kopf3" href="#"><img src="kopf/kopf_z4_4b.gif" border="0" alt="Kopf3"></a>
<a class="kopf4" href="#"><img src="kopf/kopf_z3_2a.gif" border="0" alt="Kopf4"></a>
</div>


CSS

a.kopf4 {
display:block;
position:absolute;
left:564px; top:169px;
width: 80px;
height: 54px;
}

a.knopf4:hover {
display:block;
position:absolute;
left:564px; top:169px;
width: 80px;
height: 54px;
background-image:url(kopf/kopf_z3_2b.gif);
}



Viell. hab ich ja auch tomaten auf den augen :)

mfg

[evil_overlord]

CSS

a.kopf4 {
display:block;
position:absolute;
left:564px; top:169px;
width: 80px;
height: 54px;
}

a.knopf4:hover {
display:block;
position:absolute;
left:564px; top:169px;
width: 80px;
height: 54px;
background-image:url(kopf/kopf_z3_2b.gif);
}

Ich hab da mal was markiert... ;)

[ooAlbert]

ähm ja, das hab ich entfernt :) brachte aber keine veränderung.

Ich hab dann mal sowas probiert:
html:
<a class="kopf4" href="#"></a>


css:
a.kopf4 {
display:block;
position:absolute;
left:564px; top:169px;
width: 80px;
height: 54px;
background-image:url(kopf/kopf_z3_2a.gif);
}

a.knopf4:hover {
background-image:url(kopf/kopf_z3_2b.gif);
}

Das brachte mir den "Effekt" auf die Seite aber ist das jetzt so "richtig" oder macht man diese "Mouse Over Effekte" doch leiber anders?

mfg

[DanMan]

Das brachte mir den "Effekt" auf die Seite aber ist das jetzt so "richtig" oder macht man diese "Mouse Over Effekte" doch leiber anders?
Ja. Seit 2004 (http://www.alistapart.com/articles/sprites) macht man das so (http://bueltge.de/css-sprites-einfach-erklaert/675/) (falls du kein englisch kannst).

[Nedo]

ähm ja, das hab ich entfernt :) brachte aber keine veränderung.

Ich hab dann mal sowas probiert:
html:
<a class="kopf4" href="#"></a>


css:
a.kopf4 {
display:block;
position:absolute;
left:564px; top:169px;
width: 80px;
height: 54px;
background-image:url(kopf/kopf_z3_2a.gif);
}

a.knopf4:hover {
background-image:url(kopf/kopf_z3_2b.gif);
}

Das brachte mir den "Effekt" auf die Seite aber ist das jetzt so "richtig" oder macht man diese "Mouse Over Effekte" doch leiber anders?

mfg
Passt :)

E: Hier stand nichts passendes X-D