O konečném řešení PNG v IE6

Podle mých informací, až dosud neexistovalo řešení umožňující plné a neomezené použití PNG obrázků v Internet Exploreru 6. Podle toho co vím, všechny předchozí pokusy selhaly například pokud by si člověk přál zobrazit PNG obrázek na pozadí (CSS) včetně jakéhokoli opakování.

Hleďte, je tady řešení zvané DD_belatedPNG od Drew Dillera (a předpokládám, že zde je Drew chlap).

Použití:

  1. připojíte asi 5 KB velký skript
  2. zavoláte těm elementům, které si přejete pro IE6 probudit: DD_belatedPNG.fix('#header, .important, #lofas'); a je to.

Hned se tady dá lépe dýchat!


Komentáře (23)

k formuláři

RSS kanál komentářů

    • Komentář číslo: 1
    • *
    • Jméno: Radek Hulán
    • Odesláno:
      12.2. 2009 — 14:01

    Používám toto řešení a funguje 100%, včetně třeba průhledných PNG pro :
    http://homepa­ge.ntlworld.com/bo­bosola

    • Komentář číslo: 2
    • *
    • Jméno: Martin
    • Odesláno:
      12.2. 2009 — 14:24

    Radku, ještě jednou pro pomalejší „…PNG obrázek na pozadí (CSS) včetně jakéhokoli opakování“.

    Hulánova procenta mají nejspíš větší váhu! 70 normálprocent = 100 hulánprocent

    • Komentář číslo: 3
    • *
    • Jméno: Petr Urbánek
    • Odesláno:
      12.2. 2009 — 14:31

    A co tohle?

    div {
    background:none;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader
    (src='adresa obrazku',sizingMethod='scale');
    }

    je to použito zde, včetně vypodmínkování pro IE6: http://www.hotel-prestige.cz/

    A funguje vše jak má…

    • Komentář číslo: 4
    • *
    • Jméno: Jan Martinek
    • Odesláno:
      12.2. 2009 — 14:32

    A to jsem zrovna včera došel k tomu, jak esteticky obejít nepřítomnost průhledných png v prezentaci, na které zrovna dělám.

    Ale i tak: díky za odkaz!

  1. […] článek: Kahi’s mindprint // O konečném řešení PNG v IE6 Další články s podobnou tématikou:ČR navrhla postup řešení sporu o směrnici o pracovní […]

    • Komentář číslo: 6
    • *
    • Jméno: Martin Michálek
    • Odesláno:
      12.2. 2009 — 15:13

    Dík za link. „Konečné řešení“ je možné silné slovo vzhledem k tomu, jakými krůčky se zatím všechna řešení posouvala kupředu. Ostatně viz: http://www.di­llerdesign.com/ex­periment/DD_be­latedPNG/#lac­king

    Dosud jsem vždy používal Unit PNG Fix href=„http://­labs.unitinte­ractive.com/u­nitpngfix.php“ rel=„nofollow“>http:/­/labs.unitinte­ractive.com/u­nitpngfix.php, nicméně je pravda, že s opakování PNG na pozadí jsem tu čest neměl a tak se Drew určitě bude hodit ať je to chlap či baba .-)

    • Komentář číslo: 7
    • *
    • Jméno: Petr Urbánek
    • Odesláno:
      12.2. 2009 — 15:17

    To co jsem dávál já v komentáři 3, tak funguje i na opakující se obrázek, třeba v divu, kdekoliv.

    nevím proč všichni používáte JavaScript, který nemá zapnutý každej…

    • Komentář číslo: 8
    • *
    • Jméno: Jirka
    • Odesláno:
      12.2. 2009 — 15:32

    Petr Urbánek #7: V době webů a aplikací 2.0 bych věřil tomu, že drtivá většina JS zapnutý má. A kdo ne, tak musí počítat s tím, že mu řada věcí prostě nepojede…

    • Komentář číslo: 9
    • *
    • Jméno: Petr Urbánek
    • Odesláno:
      12.2. 2009 — 15:46

    To každopádně, ale řekni to zákazníkovi, který má počítač z Roku 1,2, jede si na svých Win 98 s IE 6.0 a myslí si, že ty mu ten web uděláš tak aby muj všechno jelo… nejlíp když má „kamaráda“ nebo „známého“ co mu poradí aby to a to vypnul a nastavil…

    Takže radši se budu přiklánět k verzi bez JS ;)

    pro sebe si to udělám jak uznám za vhodné, ale pro ostatní budu radši používat tuto metodu…

    • Komentář číslo: 10
    • *
    • Jméno: yderf
    • Odesláno:
      12.2. 2009 — 15:47

    3, 7: ak si spravne pamatam, tak s tymto riesenim ziadny odkaz nad takymto pozadim nefunguje, co je problem

    • Komentář číslo: 11
    • *
    • Jméno: Petr Urbánek
    • Odesláno:
      12.2. 2009 — 15:52

    ano to byla pravda, nefungoval ani jeden :D
    ale přece máme mozek, jako webDesigneří a umíme si poradit pomocí z-indexu ;)

    koukni na ten odkaz v IE6: http://www.hotel-prestige.cz/
    a hned na titulní straně je dole ten výpis těch boxíků dělanej pomocí průhledného PNG ;)

    • Komentář číslo: 12
    • *
    • Jméno: Kahi
    • Odesláno:
      12.2. 2009 — 17:18

    [2] Martin: hej, v klidu mladej! máš pravdu, ale dá se to říct i hezky, sleduj: :-)

    [1] Radek Hulán: toto řešení neumí background-repeat.

    teď se du najíst k číňanovi, za chvíli zareaguje ještě na něco.

    • Komentář číslo: 13
    • *
    • Jméno: Kahi
    • Odesláno:
      12.2. 2009 — 18:34

    [3] Petr Urbánek: pokud vím, řešení s AlphaImageLoader si neporadí s background-repeat. Web, který odkazuješ, vidím v IE6 jinak href=„http://­kahi.cz/temp/fi­les/scr/hotel-prestige-ie6.png“ rel=„nofollow“>http:/­/kahi.cz/temp/fi­les/scr/hotel-prestige-ie6.png než v Opeře. Mám jednu teorii…

    Má tady někdo statistiku, kolik % uživatelů IE6 má vypnutý JS?

    [6] Martin Michálek: to jsem přehlíd. Asi teda nebude úplně konečným řešením, nýbrž má k němu našlápnuto :-).

    • Komentář číslo: 14
    • *
    • Jméno: Petr Urbánek
    • Odesláno:
      12.2. 2009 — 18:38

    No já to zkoušel u sebe v IE6 a naprosto v pořádku…

    • Komentář číslo: 15
    • *
    • Jméno: OndroNR
    • Odesláno:
      12.2. 2009 — 18:39

    http://www.twin­helix.com/css/i­epngfix/ aj s podporou background-repeat ;)

    • Komentář číslo: 16
    • *
    • Jméno: Radek Hulán
    • Odesláno:
      12.2. 2009 — 18:50

    Pokud ty nazýváš 100% řešení to, co neumí INPUT tag pro submit, tak já zase to svoje ;) Záleží na potřebách…

    • Komentář číslo: 17
    • *
    • Jméno: Kahi
    • Odesláno:
      12.2. 2009 — 19:16

    [14] Petr Urbánek: http://ipinfo­.info/netrende­rer/ ti dává za pravdu. Zřejmě něco shnilého je v mém IE. Nicméně má nová teorie zní, že v příkladě s http://www.hotel-prestige.cz/ je obrázek roztáhnutý a ne opakovaný.

    [15] OndroNR: Hezké. Pro další čtenáře:

    1. řeč je o IEPNGFix v2.0 Alpha, nikoli o 1.0
    2. na tom webu se dá snadno ztratit!
    3. pro funkci repeatování je třeba linkovat .js taky cca 4–5 KB

    [16] Radek Hulán: není mi jasné na koho reaguješ a jen hádám, že narážíš na Known issue DD_řešení

    <INPUT type="image"/> nodes are not supported. The node with the original PNG SRC must take on visibility:hidden;

    Nicméně… nejde snad bez problémů použít místo image inputu <button type="submit">?

    • Komentář číslo: 18
    • *
    • Jméno: Petr Urbánek
    • Odesláno:
      12.2. 2009 — 19:57

    Máš pravdu co se toho obrázku týče ;)

    a co se tohohle týče:
    nodes are not supported. The node with the original PNG SRC must take on visibility:hidden;

    tak to snad nikdo nepoužívá nebo jo?

    Využít button nebo stylovat input=„submit“ je přece mnohem jednodušší a hezčí…

    • Komentář číslo: 19
    • *
    • Jméno: Kahi
    • Odesláno:
      12.2. 2009 — 20:37

    [18] Petr Urbánek: Nevím jak moc se to používá. Viděl jsem to používat Veerle Pieters, kterou někteří v tomhle považují za docela znalou. Mně se to nelíbí, použil bych button s css.

    Stylovat input.submit není dobré, psal někde pixy.

    • Komentář číslo: 20
    • *
    • Jméno: karf
    • Odesláno:
      12.2. 2009 — 22:07

    DD_belatedPNG jsem použil už na nějakých cca 5 webech a musím říct, že jsem byl až překvapen, jak dobře to funguje, i na animovaných prvcích. Fakt výborná věcička.

    [3] Petr Urbánek: Tohle řešení jsem používal předchozích několik let v nutných případech. Pro statické obrázky se dá, ale má to zásadní omezení – nelze opakovat a nelze nastavit jinou pozici než left top (scale != repeat, i když často se to dá takto obejít). Kromě toho, jedna z motivací pro vznik DD byla i rychlost – Alpha Loader v IE je pomalejší, DD na to jde přes VML.

    • Komentář číslo: 21
    • *
    • Jméno: ondrique
    • Odesláno:
      15.11. 2009 — 11:33

    výborný tip, díky! velice easy a velice funkuje !!

    • Komentář číslo: 22
    • *
    • Jméno: Martin
    • Odesláno:
      26.1. 2010 — 20:39

    ahoj, musim to vyzkouset. Nahravani png pro IE6 pres filter a bez JS je sice elegantni, ale paklize mate web ve kterem potrebujete na male graficke prvky aplikovat jako png kvuli promenemu pozadi a techto prvku jsou stovky, tak je asi lepsi neco automatickeho s JS.

    • Komentář číslo: 23
    • *
    • Jméno: Jiriik
    • Odesláno:
      29.10. 2010 — 23:30

    Díky moc, konečně něco, co doopravdy funguje ;)

Přidat komentář

Nápověda ke psaní komentářů

Zde formátuje Texy!

  • *zvýraznění*
  • **silné zvýraznění**
  • > citace
  • "odkaz":http://kam
  • [4] reakce na komentář
  • zdrojové kódy a více

komentáře

úplně nahoru