wie ja bekannt ist, kann der IE6 transparente PNG's nicht anzeigen. Da leider Gifs Probleme haben, schöne Kanten und Schatten dazustellen, habe ich nun ein kleines Problem. In Firefox und Opera wird mein PNG schön dargestellt, im IE6 natürlich nicht. Dann habe ich gegoolet und siehe da, es gibt wohl einige Möglichkeiten das zu umgehen. Doch irgendwie hat das bei mir nicht geklappt. Ich habe das mit JS ausprobiert und auch eine andere Methode. Sicherlich habe ich was falsch gemacht. Hat vielleicht von euch jemand eine Idee, wie ich das trotzdem hinbekomme, dass die Grafik auf jedem Browser transparent zu sehen ist.

Dazu müssten wir den Versuch mal sehen

__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte

Nun ja, den Versuch kann ich leider hier nicht zeigen, ich bin nach dieser Website gegangen: klick

Habe einfach eine JS Datei erstellt, den Code eingefügt und abgespeichert.

In meiner HTML-Seite wo die PNG-Grafik angezeigt werden soll, habe ich das eingefügt

<!--[if lt IE 7]><script defer type="text/javascript" src="pngfix.js"></script><![endif]-->

Die PNG Grafik wird über eine externe CSS Datei eingefügt:

#zentriert {
position:absolute;
background-image:url(layout.png);
background-repeat:no-repeat;
top:50%;
left:50%;
width:792px;
height:586px;
margin-left:-396px;
margin-top:-293px;
border:0px solid #000000;
}

Nun habe ich was gefunden, wenn ich eine Grafik einfach nur einfügen möchte, also keine Hintergrundgrafik.

<div style="position:relative; height:65px; width:210px; filterrogidXImageTransform.Microsoft.AlphaImag eLoader( src='fileadmin/image/logo.png', sizingMethod='scale');">
</div>

Doch mit dieser Methode zeigt Firefox überhaupt keine Grafik an.

Der darf das auch nicht bekommen Mache alles ganz normal und dann hacke den IE < 7 separat.

und wie geht das mit dem Hack? ich habe keins gefunden, was bei mir funktioniert. Ich möchte das aber für IE6 machen. Hast du vielleicht ein Beispiel?

Habe mal schnell was aus einer meiner Websites rauskopiert - ein transparentes Logo, das als img im Markup steht, wird in der per CC zugewiesenen IE-CSS auch im IE < 7 sichtbar gemacht.

Erstere Regel mußt Du natürlich anpassen (background-image).

Das klappt wenn ich eine Grafik direkt in die HTML Seite einfüge, ich habe aber eine Hintergrundgrafik, dass ich per externe CSS-Datei einfügen:


position:absolute;
background-image:url(layout.png);
background-repeat:no-repeat;
top:50%;
left:50%;
width:792px;
height:586px;
margin-left:-396px;
margin-top:-293px;
border:0px solid #000000;

Kann ich jetzt einfach:

filter: progidXImageTransform.Microsoft.AlphaImageLoader (src='/grafiken/logo.png', sizingMethod='crop');

in die CSS Datei einfügen? denn wenn ich das mache, passiert bei mir nichts

Is ja lustig da such ich nach dem Thema und das ist auch noch aktuell.

Habe das gleiche Problem, dass ich eine png einfügen möchte und nach dem versuch von Heiko wird das Bild gar nciht mehr angezeigt.

Mein aktueller Code (erstmal ein Test)
für Hilfe wäre ich mal wieder dankbar.

greetz dr4g

P.S: Raff nicht ganz wieso, xhtmlforum bei mir im code hier steht aber der ist nciht im richitgen Code.

Electrohunter: Habe ich ja bereits geschrieben. Genauer ausgedrückt: Ändere erstere Regel zu background-image: none; und gib dem IE < 7 die Grafik durch die zweite Regel.

Außerdem siehe satzansatz -- PNG alpha transparency: AlphaImageLoader filter flaws in IE6