PNG w IE

Wiadomo jest, że format .png nie wyświetla przeźroczystości w IE. Znalazłam ciekawy tutorial jak rozwiązać ten problem na swojej stronie. {klik}. Wygląda na to, że działa…

13 Comments

Riddle 12/03/2007

Autolans ;)

Pozdr :)

ikari 12/03/2007

Kiedyś stosowałem, ostatnio magicznie “samo” zupełnie przestało mi działać… hm…

Lanooz 12/03/2007

@Riddle – ciekawe rozwiązanie, ale pomimo samej modyfikacji CSS’a jest to jednak nieco bardziej skomplikowane niż wstawienie skryptu na stronę :) Ale i tak zachowam na przyszłość {bookmarked}

@ikari – stosowałeś skrypt którego podałam, czy sposób Piotra w arkuszach?

Ash 12/03/2007

Troszkę inaczej rozwiązane, ale efekt ten sam. Polecam nieznającym j.angielskiego.
Webmer

Riddle 12/03/2007

Różnica jest taka, że filtry pozwalają uzyskać odpowiedni efekt w obrazkach teł, ten JS tylko działa na img :> Ale oczywiście jeśli się wstawia przezroczyste obrazki normalnie, to ten JS jest bardzo przydatny.

ikari 13/03/2007

Stosowałem zarówno ten, który podałaś, jak i te:
http://dean.edwards.name/IE7/compatibility/

Różnica jest taka, że dziś IE6 mam tylko w wersji ‘standalone’, tj. wszystkie pliki razem + iexplore.exe.local. Co ciekawe, kolega ma IE6 jako główną przeglądarkę nadal i ma ten sam problem.
W IE6 próbowałem wkleić skrypt przez jakiś mądry toolbarowy plugin – wywalił błąd, że nie zna obiektu ‘navigator’ (jedna z pierwszych linijek skryptu)…

Mafaldinha 14/03/2007

Niestety podany skrypt nie działa…może coś gdzieś źle zrobiłam, hmmm…? a szkoda, bo przez to moj blog na IE wygląda gorzej niż by mógł. A nie wszyscy chcą się przesiadać na FF :(

Lanooz 15/03/2007

Właśnie dopiero teraz sie zmusiłam do pokombinowania tymi sposobami na .png w IE
Sposów jaki podał Ash, nie bardzo zadziałał (powiększa grafikę i ją wymownie przekreśla czerwonym krzyżykiem, jakby nie istniała).
Sposób Riddle’a nie próbowałam, szczerze mówiąc z powodu lenistwa a to wygląda dużo bardziej skomplikowanie ;)
W przeciwieństwie do powyższych, propozycja naprawienia błędu IE na stronie ze skryptem .js, którą podałam we wpisie, zadziałał.
Najwidoczniej coś źle zrobiłaś Mafaldinha.
Po ściągnięciu skryptu, załaduj go do głównego katalogu serwera i wstaw ten kod który podają w head – nic więcej

ikari 15/03/2007

Lanooz, ja jednak trzymam się swojej wersji – oba te skrypty działały i oba przestały nawet na ich własnych stronach — dlatego myślę, że MS mógł wprowadzić coś w ramach obsesji na punkcie bezpieczeństwa, co blokuje działanie skryptów, lub dokonał jakichś modyfikacji w innym DOM czy silniku JS
(Riddle, co to jest navigator i czemu mogło go zabraknąć? :))

Lanooz 15/03/2007

Na ich własnych stronach? Przecież działa :>

Ok…Zobaczymy, będę regularnie sprawdzać ;)

ikari 16/03/2007

Lan, no wlasnie o to chodzi – u Ciebie dziala, u mnie i kilku osob dzialalo… kiedys. Nie wiem, co od tej pory sie zmienilo — moja sytuacja dobrym przykladem nie bedzie, bo ja mam IE7 jako glowna przegladarke, i “szostke” moge uruchamiac tylko w wersji samodzielnej, ale np. Golczas ma IE6 i przezroczystosc mu nie dziala… Sam kiedys na kilku stronach uzywalem tych skryptow i wiem, ze dzialaly, a ze skrypty sie nie zmienily, to cos musialo zmienic sie w naszych przegladarkach ;) Mafaldinha powinna sprawdzic, czy dzialaja jej na stronie demo – jesli tak, to faktycznie robi cos zle, jesli nie – to nie w tym jest problem ;)
(koment pisany hardkorowo, w Lynxie :))

Cezary Okupski 27/03/2007

Wspomnieć trzeba, że bywa często, że Internet Explorer 6 miewa problemy z linkami nad takimi PNG-ami. Dotyczy to bardziej tego CSS-owego rozwiązania wspomnianego przez Riddle niż podmieniania przy pomocy JavaScriptu wspomnianego przez autorkę, bo jakoś trzeba te linki nad obrazkiem umieścić (najpewniej CSS-em). Jednak i na to jest lekarstwo.

Mi do gustu często przypada progressive enhancement CSS-owy w stylu:

#element{background:url('something.png') no-repeat}
* html #element{background:url('something.gif') repeat}

co wszyscy zapewne rozumieją. ;)

Cezary Okupski 27/03/2007

To drugie miało być też no-repeat, a różnić się miało jedynie typem obrazka. Szkoda, że nie mogę wyedytować wpisu. :(