PNG-Grafiken mit Alphatransparenz für IE

[Zeromancer]

Hallo zusammen,

auch ich möchte mal meine betreuten Seiten mittels m.E. schönen Icons auflockern. Sie liegen im PNG-Format vor und wie es so immer so ist, der IE zaubert diesen schönen grauen Hintergrund.

Nach Recherchen im Archiv und bei Google habe ich dann

  
img {  
  behavior: url('/pixx/layout_icons/iepngfix.htc');  
}  

in mein Stylesheet eingefügt (vgl. < http://www.twinhelix.com>). Im IE werde nun aber Rahmen um die Grafiken angezeigt. Meine Frage: Liegt es an den Grafiken selbst oder reicht die obige CSS-Anweisung zzgl. der htc-Datei nicht aus?

Zum Vergleich ein kleines Bild:

Mit freundlichen Grüßen,
André

[Zeromancer]

Hallo,

Meine Frage: Liegt es an den Grafiken selbst oder reicht die obige CSS-Anweisung zzgl. der htc-Datei nicht aus?

kann es ja bald nicht glauben, dass nicht mal ein kleiner Hinweis kommt?! ;-)

Mit freundlichen Grüßen,
André

[schwarze Piste]

Tachchen!

kann es ja bald nicht glauben, dass nicht mal ein kleiner Hinweis kommt?!

Ich vermute mal, die meisten kennen sich schlicht nicht mit dieser htc-Datei
aus!? Ich habe glaube ich ganz verschwommen eine Erinnerung, eine Seite mit
einer "speziellen Zusatzdatei" gesehen zu haben, die das Problem der
Alphatransparenz lösen soll ... aber Tipps hätte ich mir da auch nicht zugetraut.

Schau dich doch einfach nach einer alternativen Herangehensweise um?
Die Möglichkeiten rund um den alphaimageloader sind doch inzwischen
kein Geheimnis mehr!?

Gruß

Die schwarze Piste

[Ashura]

Hallo schwarze Piste.

Schau dich doch einfach nach einer alternativen Herangehensweise um?
Die Möglichkeiten rund um den alphaimageloader sind doch inzwischen
kein Geheimnis mehr!?

Das ist keine Alternative. Inhalt der alpha.htc:

  
<public:component>  
<public:attach event="onpropertychange" onevent="propertyChanged()" />  
<script>  
  
var supported = /MSIE (5\.5)|[6789]/.test(navigator.userAgent) && navigator.platform == "Win32";  
var realSrc;  
var blankSrc = "/img/blank.gif";  
  
if (supported) fixImage();  
  
function propertyChanged() {  
   if (!supported) return;  
  
   var pName = event.propertyName;  
   if (pName != "src") return;  
   // if not set to blank  
   if ( ! new RegExp(blankSrc).test(src))  
      fixImage();  
};  
  
function fixImage() {  
   // get src  
   var src = element.src;  
  
   // check for real change  
   if (src == realSrc) {  
      element.src = blankSrc;  
      return;  
   }  
  
   if ( ! new RegExp(blankSrc).test(src)) {  
      // backup old src  
      realSrc = src;  
   }  
  
   // test for png  
   if ( /\.png$/.test( realSrc.toLowerCase() ) ) {  
      // set blank image  
      element.src = blankSrc;  
      // set filter  
      element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" +  
                                     src + "',sizingMethod='scale')";  
   }  
   else {  
      // remove filter  
      element.runtimeStyle.filter = "";  
   }  
}  
  
</script>  
</public:component>  

Es wird also auch nur auf den AlphaImageLoader zurück gegriffen.
Bei mir hat er aber noch nie funktioniert, egal wie ich ihn eingebunden habe.

Einen schönen Donnerstag noch.

Gruß, Ash*feel free*ura

[schwarze Piste]

Tachchen!

Es wird also auch nur auf den AlphaImageLoader zurück gegriffen.

Geahnt hatte ich sowas, aber ich wollte das Ding jetzt auch nicht noch suchen.

Bei mir hat er aber noch nie funktioniert, egal wie ich ihn eingebunden

Das kann ich allerdings nicht bestätigen. Bei mir funktioniert die Technik
einwandfrei. Je nach Einbindung aber AFAIK nur mit aktivierten JavaScript
bzw. nachdem man die "Skriptalarmleiste" des SP2 überwunden hat. ;-)

Gruß

Die schwarze Piste

[Ashura]

Hallo schwarze Piste.

Bei mir hat er aber noch nie funktioniert, egal wie ich ihn eingebunden

Das kann ich allerdings nicht bestätigen. Bei mir funktioniert die Technik
einwandfrei. Je nach Einbindung aber AFAIK nur mit aktivierten JavaScript
bzw. nachdem man die "Skriptalarmleiste" des SP2 überwunden hat. ;-)

Muss ActiveX nicht auch noch aktiviert sein? (Normalerweise immer aus, aus Testzwecken ein Mal aktiviert--keine Veränderung.)

Einen schönen Donnerstag noch.

Gruß, Ash*feel free*ura

[Zeromancer]

Hallo Ashura, hallo schwarze Piste,

Es wird also auch nur auf den AlphaImageLoader zurück gegriffen.
Bei mir hat er aber noch nie funktioniert, egal wie ich ihn eingebunden habe.

ich habe gar keinen Bock mehr, dieses Herumgefummele zu machen! Also Grafiken raus! Spart Zeit, Download und ... Nerven.

Mit freundlichen Grüßen,
André

[Ashura]

Hallo Zeromancer.

ich habe gar keinen Bock mehr, dieses Herumgefummele zu machen! Also Grafiken raus! Spart Zeit, Download und ... Nerven.

Warum nimmst du die PNGs nicht einfach so in's Dokument?
Wenn es sich um 32bit-PNGs handelt, kannst du eine Indexfarbe angeben, die vom IE (normalerweise) anstelle der alphatransparenten Bereiche angezeigt wird.

Verzichte nicht auf die Vorzüge von PNG, nur weil veraltete Browser damit nicht umgehen können.

Einen schönen Donnerstag noch.

Gruß, Ash*feel free*ura

[Zeromancer]

Hallo Ashura,

Wenn es sich um 32bit-PNGs handelt, kannst du eine Indexfarbe angeben, die vom IE (normalerweise) anstelle der alphatransparenten Bereiche angezeigt wird.

mittels Photoshop oder wie?

Mit freundlichen Grüßen,
André

[Ashura]

Hallo Zeromancer.

Wenn es sich um 32bit-PNGs handelt, kannst du eine Indexfarbe angeben, die vom IE (normalerweise) anstelle der alphatransparenten Bereiche angezeigt wird.

mittels Photoshop oder wie?

Ob und wie es dort möglich ist, weiß ich nicht--probiere es aus.
Ich habe bisher immer mit Fireworks gearbeitet, die damit erstellten 32bit-PNGs verfügen über diese Eigenschaft, wenn ich eine Indexfarbe festlege.

Einen schönen Donnerstag noch.

Gruß, Ash*feel free*ura

[Zeromancer]

Hallo Ashura,

Wenn es sich um 32bit-PNGs handelt,

mein Photoshop bietet leider nur 24 oder 8 Bit-PNG. Da muss man sich entscheiden, ob transparent oder weißer Hintergrund. Habe mich für den weißen Hintergrund entschieden. Die Hauptsache ist, dass die Klarheit und Struktur der Bilder erhalten bleibt. Unsere Seite ist eh weiß im Hintergrund.

Mit freundlichen Grüßen,
André