Hover im IE

Computer: Software & Programmierung HTML & CSS
#1

Ich versuche gerade ein kleines Menu zu basteln.

Wenn ich auf einen Link gehe soll die dahinterliegende Grafik wechseln.
Das ganz ohne mouseover nur via hover.

Bisher sieht das so aus:

<!–

#hmenu li a { color: #808080; text-decoration: none; }
#hmenu li a img { margin-left: 76px; width: 66px; height: 66px; display: inline; }
#hmenu li a:hover img { display: none }
#hmenu li a span img {display: none }
#hmenu li a:hover span img { margin-left: 76px; width: 66px; height: 66px; display: inline; }

–>

link1

link2

link3

Der Code läuft bei Firefox auch einwandfrei. Beim IE hingegen sehe ich immer nur die erste Grafik. Die zweite taucht beim hovern nicht auf.

Ich habe das ganze auch schon mit visibility probiert … kein Erfolg.

Was mache ich falsch?

#2

Hi AltF4,

ich weiss nicht genau was du / der IE dort schon wieder falsch macht.
aber ich hab eine andere hover variante für dich. die bei mir erprobter weise funktioniert und auch noch den vorteil hat das sie weniger markup erzuegt.

zuerst scheimst du das bild aus dem link und den spann gleich mit:
daraufhin sieht er wie folgt aus:

link1

und du gibst dem link dann einfach ein background per CSS und sorgtst per Padding Dafür das der link-text nicht in das bild ragt. must natürlich das image auf no-repeat stellen.

und beim hover veränderst du dann das url des background images.
wenn deine einzelnen links unterschiedliche images haben sollen.
läst sich das gut machen in dem man den einzlenen links unterschiedliche id’s gibt.

und dannn natürlich im css die url’s entsprechen für die einzelnen id’s angibt.

a#link1 {background-image:url(link1_normal.jpg);}
a#link1:hover {background-image:url(link1_hover.jpg);}

gruss chris

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]