Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „PNG Format im Explorer?!“

stephfan

Nicht mehr ganz neu hier

Hallo...


ich hab mal ein bischen rumprobiert und dabei bin ich auf ein ziemliches Problem gestossen:

Ich habe mir mit PS Bilder als PNG abgespeichert und die dann mit DW eingebunden...Bei der Überprüfung im Browser ( genauergesagt im Explorer)hatte ich um meine Bilder dann ziemlich häsliche Kästen;-)
Nun meine Frage: Erkennt der Explorer das PNG-Format nicht,oder gibt's da'n speziellen Trick?!

THX

Steph
 

cebito

undefined

AW: PNG Format im Explorer?!

Der Browser nennt sich Internetexplorer (kleiner aber feiner Unterschied). Bis Version 6 (oder 7?) - kann ich so nicht sagen, hab ich nicht - kann er keine transparenten png's darstellen.
Wie sind die Bilder denn eingebunden, als Hintergrund oder normal als img?
 
N

neo1977_chris

Guest

AW: PNG Format im Explorer?!

soweit ich weiß kann nur mozilla mit png umgehen.
 

cebito

undefined

stroyer

Aktives Mitglied

AW: PNG Format im Explorer?!

So lange es sich nur um eine Alpha Maske (entweder Sichtbar/komplett transparent) handelt, kann man das über einen MS-Filter einbinden. Andernfalls gibt es keine Möglichkeit, mit IEs unter Version 7 einen Transparenzverlauf anzuzeigen.
 

injected23

frischfleisch

AW: PNG Format im Explorer?!

*auchmalmeinensenfdazugeb* :D

es gibt 2 verschiedene ansätze transparente pngs im IE < 7 zu behandeln

1. das png ist als hintergrund via css (background: url(blabla/grafik.png))
gesetzt. z.b. für einen <div> tag

in diesem fall kann man ein einfaches workaround mit dem im IE integrierten alphaimageloader nehmen

Code:
.start_marked{ //für mozilla & co
     height : 200px;
     width : 50px;
     background : url (img/start_Active.png);
}

* html .start_marked{ //extrawurst für ie
    background    : none;
    filter        : progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/start_Active.png', sizingMethod='scale');
}
wichtig hierbei: alles was mit * html anfängt wird NUR vom IE gelesen.. mozilla und konsorten ignorieren diese passage vollständig.. d.h. du musst für diese browser dieselbe css klasse nocheinmal definieren. (normalerweise designe ich alles fertig für mozilla und überschreibe dann lediglich das background attribut wie in meinem beispiel oben zu sehen ist)

2. das png soll als klickbares objekt.. z.b. für einen button o.ä. eingebunden werden.
also z.b. über einen <img> tag

in diesem fall hilft soweit mir bekannt ist nur javascript... nicht gerade schön... aber es hilft

dabei handelt es sich dann auch um die bereits angesprochene funktion fixPNG

edit:
soweit ich weiß ist diese nicht von irgendwem mit einem uhrheberstempel versehen... daher poste ich den inhalt jetzt mal.. wenn das ein problem ist bitte bescheid geben oder rauslöschen.

Code:
<!--[if gte IE 5.5000]>
   <script language="JavaScript"> var ie55up = true </script>
<![endif]-->
<script language="JavaScript" type="text/javascript">
<!--
function fixPNG(myImage) // correctly handle PNG transparency in Win IE 5.5 or higher.
   {
    if (window.ie55up)
     {
     var imgID = (myImage.id) ? "id='" + myImage.id + "' " : ""
     var imgClass = (myImage.className) ? "class='" + myImage.className + "' " : ""
     var imgTitle = (myImage.title) ? "title='" + myImage.title + "' " : "title='" + myImage.alt + "' "
     var imgStyle = "display:inline-block; cursor:pointer;" + myImage.style.cssText
     var strNewHTML = "<span style=\" ;\"" + imgID + imgClass + imgTitle
     strNewHTML += " style=\"" + "width:" + myImage.width + "px; height:" + myImage.height + "px;" + imgStyle + ";"
     strNewHTML += "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
     strNewHTML += "(src=\'" + myImage.src + "\', sizingMethod='scale');\"></span>"
     myImage.outerHTML = strNewHTML
     }
   }
//-->
</script>
 
Zuletzt bearbeitet:

injected23

frischfleisch

AW: PNG Format im Explorer?!

naja.. wenn du meinst..

aber mit gifs bekommst du meistens keine schönen farbverläufe hin... von detaillierten bildern mal ganz zu schweigen...
das ist ja gerade der vorteil von pngs.. weil sie verlustfrei arbeiten

außerdem habe ich die erfahrung gemacht dass bei gifs meist ein hässlicher rand entsteht..
 

anoX

Nicht mehr ganz neu hier

AW: PNG Format im Explorer?!


Na wenn keine Transparenz da ist, brauch ich auch kein .png. Daher hab ich das mal vorausgesetzt und damit kann der IE6 bekanntlich NICHT umgehen. Andernfalls auf .gif umsteigen oder halt mit PNG-Fix versuchen. Funktinioniert in der Agentur einwandfrei und ist relativ leicht einzubauen.
 

cebito

undefined

AW: PNG Format im Explorer?!

naja.. wenn du meinst..

aber mit gifs bekommst du meistens keine schönen farbverläufe hin... von detaillierten bildern mal ganz zu schweigen...
das ist ja gerade der vorteil von pngs.. weil sie verlustfrei arbeiten

außerdem habe ich die erfahrung gemacht dass bei gifs meist ein hässlicher rand entsteht..
So ist es, sonst könnte man sich ja das ganze Prozedere sparen und gleich .gif nehmen.
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.158
Beiträge
2.581.880
Mitglieder
67.225
Neuestes Mitglied
Petra
Oben