Probleme mit hover background-image IE6
JXR
- css
Hallo,
hat diesen Bug schonmal jemand gesehen?
Ich habe: eine Liste (ul/li) mit Navigationslinks. Bei Mouseover soll ein gif als Hintergrundgrafik eingeblendet werden, ohne Mouseover ist sie nicht als Hintergrund-Grafik gesetzt udn nicht sichtbar. Klappt auch: in Opera, Mozilla/Firefox. Nur im IE6 nicht! Interessanterweise wenn ich die Links mit der Mouse markiere sehe ich die Gifs sogar.
Wenn ich zusätzlich eine Background-Color setze wird diese auch im IE bei Mouseover gewechselt. Nur das Gif wird nie angezeigt.
Ich dachet ich hätte nun langsam mal alles gesehen was der IE6 zu bieten hat.
Bekannter Bug? Gibt es eine Lösung?
Code HTML:
<ul>
<li><a href="a.html" class="navigation">a</a></li>
<li><a href="b.html" class="navigation">b</a></li>
<li><a href="c.html" class="navigation">c</a></li>
</ul>
Code CSS:
a.navigation:link
{
margin:0;
padding:0px 0px 0px 17px;
font-weight: bold; font-style: normal; font-family: verdana,arial,geneva,helvetica,sans-serif;
color:#F18503; letter-spacing: normal; text-decoration: none;
}
a.navigation:visited
{
margin:0;
padding:0px 0px 0px 17px;
font-weight: bold; font-style: normal; font-family: verdana,arial,geneva,helvetica,sans-serif;
color:#F18503; letter-spacing: normal; text-decoration: none;
}
a.navigation:hover
{
margin:0;
padding:0px 0px 0px 17px;
font-weight: bold; font-style: normal; font-family: verdana,arial,geneva,helvetica,sans-serif;
color:#000000; letter-spacing: normal; text-decoration: underline;
background-image:url(bullet.gif); background-repeat:no-repeat;
}
a.navigation:active
{
margin:0;
padding:0px 0px 0px 17px;
font-weight: bold; font-style: normal; font-family: verdana,arial,geneva,helvetica,sans-serif;
color:#000000; letter-spacing: normal; text-decoration: underline;
background-image:url(bullet.gif); background-repeat:no-repeat;
}
hi,
Bekannter Bug?
Wenn da auch noch irgendwo floats mit im Spiel sind (ist ja nur rudimentär, was du an Code gezeigt hast), dann könnte es der IE/Win Disappearing List-Background Bug sein.
gruß,
wahsaga
Hallo,
Ja es sind floats im Spiel. Ok, danke für den Hinweis und den Link!
Ein display:inline; hat meine floatende ul schon.
Und bei background-color funktioniert es bei mir seltsamerweise.
Nachdem ich nun bei :link und :visited ein anderes Bild lade (ein komplett transparentes GIF) und dieses gegen das gewünschte bei :hover und :active auswechseln lasse, klappt es auch im IE6.
<blabla class="auf Microsoft schimpf">
Tolles Produkt! Danke Microsoft. Ich freue mich auf den Tag wenn der Ie6 nur noch von <3% der WWW-Benutzer benutzt wird. Den IE7 hab ich mir noch nei angeschaut. Könen die nicht einfach aufhören Browser zu entwickeln und ihre Internet Explorer-Software einfach einstampfen? oder wenigstens eine andere Renderengine verwenden? Opera oder Mozilla. Safari unter Windows war ja noch nicht so der Knaller.
</blabla class="auf Microsoft schimpf">
Vielleicht hilft diese Lösung ja mal jemand anderem beim selben Problem.
Schönen Tag noch.
Bild via CSS verschieben würde wohl auch gehen. Vielleicht probier ich das mal. Ich habe diese Methode immer wieder mal gesehen und mich immer gefragt warum man macht.
:)
hi,
Bild via CSS verschieben würde wohl auch gehen. Vielleicht probier ich das mal. Ich habe diese Methode immer wieder mal gesehen und mich immer gefragt warum man macht.
Um Probleme mit dem unzulänglichen Cache-Mechanismus des IE zu umgehen, der bei Verwendung von zwei einzelnen Bildern, die ausgetauscht werden, oftmals zu einem "Flackern" dabei führt.
gruß,
wahsaga