|
|||
IE 6 png Transparenz trotz iepngfix.htc geht nicht
Hallo,
habe folgendes Problem. Ich habe ein vertikale Navigation mit Slide komplett in CSS erstellt. Funktioniert alles wunderbar. Nur im IE 6 wird mir mein transparentes png Bild(weiß mit deckkraft 15% )trotz iepngfix.htc nicht transparent angezeigt. Habe schon folgendes versucht: in der CSS Datei folgende Angabe PNG-Fix auf alle Elemente anwenden { behavior: url(iepngfix.htc); } funktioniert nicht. PNG-Fix nur auf vorhandene Hintergrundgrafiken anwenden: #menu li.sub ul :hover{ background: url(../img/navi_sub1.png) no-repeat; behavior: url(iepngfix.htc); } #menu li.sub ul{ background: url(../img/navi_sub1.png) no-repeat; behavior: url(iepngfix.htc); } dann erscheint folgende Fehlermeldung IEPNGFix: children of positioned element are unclickable <ul> Hier mal der gesamte Code: Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <html> <head> <title>Untitled</title> <link rel="stylesheet" href="styles/navi.css" type="text/css" media="all"> </head> <body> <ul id="menu"> <li><a href="index.html">Home</a></li> <li><a href="agentur.html">Agentur</a></li> <li class="sub"><a href="#">Leistungen<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul> <li><a href="leistung_print.html">- Print</a></li> <li><a href="leistung_internet.html">- Internet</a></li> <li><a href="leistung_foto.html">- Fotografie</a></li> </ul><!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="sub"><a href="#">Referenzen<!--[if gte IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul> <li><a href="ref_print.html">Print</a></li> <li><a href="ref_web.html">Internet</a></li> <li><a href="ref_foto.html">Fotografie</a></li> </ul><!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li><a href="kontakt.html">Kontakt</a></li> </ul> </body> </html> Code:
/* *********************************************** */ /* Navi */ /* *********************************************** */ #menu{ list-style-type: none; padding: 10px 0 0 0; margin: 0; width: 225px; z-index: 100; float: left; height: 196px; background: url(../img/navi_bg.jpg) no-repeat top; } /* *********************************************** */ /* navigationspunkte */ /* *********************************************** */ #menu li{ float: left; background: url(../img/navi_bu.gif) no-repeat 0 top; } #menu li, #menu li a{ display: block; color: #fff; font-family: arial, sans-serif; font-size: 12px; line-height: 26px; width: 225px; text-decoration: none; cursor: pointer; font-weight: bold; text-indent: 40px; } #menu :hover{ color:#436d21; background:url(../img/navi_bu.gif) no-repeat; z-index:500; white-space:nowrap; } #menu :hover > a{ color: #436d21; z-index: 500; white-space: nowrap; } #menu table{ border-collapse: collapse; padding: 0; margin: 0 -1px -1px; } /* *********************************************** */ /* Sub-navi */ /* *********************************************** */ #menu ul{ position: absolute; left: -9999px; width: 225px; list-style-type: none; padding: 0; margin: 0; } #menu :hover ul{ position: static; height: 60px; margin-top: -1px; } #menu li.sub ul :hover{ background: url(../img/navi_sub1.png) no-repeat; behavior: url(iepngfix.htc); } #menu li.sub ul{ background: url(../img/navi_sub1.png) no-repeat; behavior: url(iepngfix.htc); } #menu li.sub ul li, #menu li.sub ul li a{ background: url(../img/navi_bu1.gif) no-repeat; line-height: 20px; font-size: 11px; } #menu :hover ul li, #menu :hover ul li a{ text-indent: 50px; } { behavior: url(iepngfix.htc); } |
Sponsored Links |
|
|||
Deiner Regel mit dem behavior fehlt vor dem Deklarationsblock der Selektor. Vor der geschweiften Klammer muss wenigstens der Universalselektor * stehen. Guck noch mal in die Beispieldatei mit der Anleitung von Angus Turnbull.
Im Übrigen solltest du die Warnmeldung ernst nehmen. Wenn der Block, der das PNG trägt, positioniert ist, dann sind die Kinder nach Anwendung des PNGFixes nicht anklickbar. Wenn was nicht klappt, dann bitte mal eine URL bereitstellen. Die PNGs will ich mir nicht selbst malen. |
Sponsored Links |
|
|||
Hi Ingo,
Ja du hattest recht, der Universalselektor hat hier gefehlt, das waren noch Überreste, die ich vergessen hatte zu löschen. Ich hatte behavior ja bereits direkt den beiden Punkten mit den png-Bildern zugewiesen So besteht das Problem also nach wie vor. Die Fehlermeldung kommt 2 x. Danach sieht es richtig aus, aber nur wenn ich das transparente Bild nur einmal verwende und ich kann auch die Untermenüpunkte anklicken. Wenn ich aktualisiere erhalte ich erneut die Fehlermeldung. Aber die Meldung muss natürlich unbedingt weg... Hab es einmal noch etwas vereinfacht und nur einmal das transparente png verwendet. Bin auch bereit auf das zweite png zu verzichten wenn es dafür geht Hier mit nur einem png Untitled Hier mit beiden 2png Gruß caja Geändert von caja13 (04.09.2008 um 11:06 Uhr) |
|
|||
Die Warnmeldungen erhältst du, weil das ganze positioniert ist. Daher sind die innen liegenden Links nicht anklickbar. Ich guck es mir nachher mal an.
Wenn du die Warnmeldungen nicht sehen willst, musst du im Javascript des Behaviors die entsprechende Zeile auskommentieren. |
|
|||
nun, diese Zeilen:
PHP-Code:
|
|
|||
Ich habe gerade eine Geschäftsidee ... aber lassen wir das.
Du sollst die htc-Datei in einem Editor deiner Wahl öffnen, die betreffenden Zeilen suchen und auskommentieren. Wie man auskommentiert, siehst du, wenn du die htc öffnest. Da ist bereits eine Menge an Kommentaren. |
Stichwörter |
ie6, iepngfix.htc, png, transparenz |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Transparenz PNG und Rendering | mcdaniels | CSS | 6 | 20.05.2011 08:27 |
PNG transparenz im Hintergrund! IE8 Problem | Chrizzel | CSS | 20 | 24.08.2010 11:59 |
png mit transparenz im ie 6 als hg | martin_gnoe | CSS | 17 | 06.09.2008 19:23 |
png ie bug und behebung mit iepngfix.htc | noXx | CSS | 6 | 16.09.2006 19:02 |
PNG Transparenz, CSS und Internet Explorer | fanttomas | CSS | 1 | 14.02.2006 11:43 |