mercoledì, dicembre 31, 2008

Come migliorare le immagini con Internet Explorer

Internet Explorer è da sempre la gioia degli sviluppatori incompetenti e la croce di quelli che invece ne sanno. Il motivo è che permette di scrivere codice a capocchia e più o meno le cose funzionano ma nello stesso tempo non implementa correttamente un sacco di aggeggi e questo può essere parecchio fastidioso.

Ho trovato questo articolo: Code: Flickr Developer Blog - On UI Quality (The Little Things): Client-side Image Resizing
Dato che è in inglese ve lo riassumo.

I browser "moderni" usano la "interpolazione bicubica" per ridisegnare le immagini quando vengono "scalate" all'interno di una pagina, cioè quando la loro dimensione originaria viene cambiata dal browser. IE7 invece no, quindi la qualità di queste immagini risulta inferiore a meno che non specifichiate questa proprietà via CSS:

img { -ms-interpolation-mode:bicubic; }

Ma in IE6 e precedenti non funziona quindi bisogna usare il "AlphaImageLoader Filter", cioè:
<div style="width:320px;height:320px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imagename.gif', sizingMethod='scale');"></div>

Questo mette come "sfondo" del div di 320x320px l'immagine scalata.
Nota: questo "filtro" si usa anche per ottenere la trasparenza con le immagini PNG in IE. Bella roba eh?

2 commenti:

  1. Passaggio veloce per augurarti un Buon 2009 e un anno ricco di soddisfazioni
    @enio

    RispondiElimina
  2. visto che sei un "esperto" ANCHE DI fIREFOX 3.0, come posso tenete le scritte scorrevoli nella striscia che gli assegna FrontPage. Con Explorer va bene con Firefox no! es. al link http://enio1947.netfirms.com

    p.s se vuoi puoi mandarmi una mail a nonnoenio@yahoo.com grazie.

    RispondiElimina