zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden IE 6 png Transparenz trotz iepngfix.htc geht nicht

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.09.2008, 19:11
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Frage 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>
CSS
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);
}
Bin schon ewig am rumprobieren. Hoffe ihr habt eine Lösung für mich.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.09.2008, 21:19
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

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.
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 04.09.2008, 10:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

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)
Mit Zitat antworten
  #4 (permalink)  
Alt 04.09.2008, 11:42
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

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.
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #5 (permalink)  
Alt 04.09.2008, 11:47
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

das komische ist aber ja, dass die Links anklickbar sind.
Mit Javascript kenn ich mich leider gar nicht aus, was muss ich da genau auskommentieren?
Gruß caja
Mit Zitat antworten
  #6 (permalink)  
Alt 04.09.2008, 16:42
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

nun, diese Zeilen:

PHP-Code:
 if (&& (/relative|absolute/i).test(currentStyle.position))
    
alert('IEPNGFix: Children of positioned element are unclickable:\n\n<' +
     
nodeName + (id && ' id=' id) + '>'); 
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #7 (permalink)  
Alt 05.09.2008, 11:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

Hi Ingo,
sorry bin gestern nicht mehr dazu gekommen. Danke für dein Lösungsvorschlag, aber
wohin genau muss ich denn diese Zeilen schreiben?
Gruß caja
Mit Zitat antworten
  #8 (permalink)  
Alt 05.09.2008, 11:27
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

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.
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #9 (permalink)  
Alt 05.09.2008, 12:01
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

Hi Ingo,
nachdem ich es wie folgt abgeändert habe:
Code:
if (t && (/relative|absolute/i).test(currentStyle.position));
funktioniert alles bestens!
Danke!
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
ie6, iepngfix.htc, png, transparenz

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ä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


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:29 Uhr.