Stufo di dovermi limitare ad immagini in formato .jpg e .gif, in un lavoro ho deciso di adottare i .png per avvantaggiarmi delle trasparenze che questo tipo di formato rende possibili.
Ovviamente in fase di test ho dovuto scontrarmi con la dura realtà dei fatti e cioè che Internet explorer 6 non interpreta correttamente il canale alfa del formato PNG.
Spulciando sulla rete ho trovato quella che per me, nel caso specifico è risultata la soluzione ottimale: semplice, leggera e di facile implementazione, ha funzionato così bene che ho deciso di condividerla.
——————————-
Scaricare l’archivio contenente tutto l’occorrente ed aggiungerlo al proprio progetto; dopo averlo fatto, inserire nel proprio documento html quanto segue:
<!--[if lt IE 7]>
<script type="text/javascript" src="js/unitpngfix/unitpngfix.js"></script>
<![endif]-->
Fate attenzione che il percorso del documento .js rifletta l’effettiva posizione sul vostro server. Io di solito creo una cartella nella root del progetto chiamandola js ed al suo interno per ogni libreria creo una cartella contenente tutto il necessario per il funzionamento.
Il commento condizionale fa in modo che tutti i browser ignorino il file Javascript e passino oltre mentre le versioni di Internet Explorer 6 e precedenti caricheranno la libreria.
A questo punto bisogna accertarsi di avere l’immagine clear.gif posizionata nella cartella del progetto per poi aprire il file unitpngfix.js ed assicurarci che il percorso punti correttamente al file .gif:
var clear="js/unitpngfix/clear.gif"; //path to clear.gif
Unit PNG Fix, per impostazione predefinita, viene eseguito automaticamente su tutti i .png della pagina. Se lo si desidera è possibile forzare lo script ad intervenire solo su elementi specifici con l’aggiunta della classe “unitPng” a tali elementi; in questo modo si possono evitare problemi di layout che potrebbero essere causati dall’impostazione predefinita.
——————————-
Ulteriori approfondimenti sul sito Unit PNG fix.
Buon divertimento!
Tag: ∞ internet explorer, ∞ javascript, ∞ tips
).