Sfruttare la trasparenza delle png su iexplorer!

Il formato PNG per le immagini è sempre più diffuso sul web e con l utilizzo delle trasparenze consente di ottenere ottimi risultati, superiori a quelli che si hanno con le gif. Purtroppo mentre con i vari Firefox, Opera, ecc.. tale caratteristica può essere sfruttata, con Iexplorer non sono supportate le trasparenze, le quali vengono visualizzate come un alone bianco.

Ecco la soluzione al problema:

create un div container, naturalmente all interno del vostro body:

 

dopodichè create uno stile per la classe, inserendo il nome della vostra immagine

div.image {
background:url(image-transparent.png) no-repeat;
height:100px;
width:100px
}

Il codice sopra funziona per Firefox, adesso create un altra classe per Iexplorer:

div.image {
background:none;
filter:progid:DXImageTransform.Microsoft.
AlphaImageLoader(src= image-transparent.png ,sizingMethod= crop );
}

ed il gioco è fatto!

Fonte: hongkiat.com