Visualizza post
1
templates - tips & tricks / Re: Utilizzare png trasparenti anche con IE
« il: 30 Mar 2007, 14:11:00 »
Mi permetto di contribuire postando un esempio con l'utilizzo della trasparenza direttamente su un tag IMG. Da precisare che il tag <IMG> dovrà necessariamente essere contenuto in un blocco: span, div, ul ecc..
L'esempio riportato e' con il DIV.
Occorre inserire un commento condizionale che interprera' solamente IE nell'HEAD della pagina web. Posto un esempio di pagina completa.
<HEAD>
<!--[if gte IE 5.5]>
<style type="text/css">
DIV#top-bottom{display:block;width:250px;height:80px;
filter:progid:DXImageTransform.Microsoft.AlphaImageLo ader(src='logo.png'); }
DIV#top-bottom img{width:250px;height:80px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); }
</style>
<![endif]-->
</HEAD>
<HTML>
<div id="top-bottom">
<img src="logo.png" border="0" width="250" height="80" alt="logo" />
</div>
</HTML>
Un altro metodo potrebbe essere quello dell'utilizzo di un file in Javascript per rendere la trasparenza su tutte le immagini. E' comodo solo che richiede javascript abilitato sul browser dell'utente (IE sempre)
Ecco il link dove ho preso la documentazione in inglese: http://homepage.ntlworld.com/bobosola/index.htm
Ciao!
Marco
L'esempio riportato e' con il DIV.
Occorre inserire un commento condizionale che interprera' solamente IE nell'HEAD della pagina web. Posto un esempio di pagina completa.
<HEAD>
<!--[if gte IE 5.5]>
<style type="text/css">
DIV#top-bottom{display:block;width:250px;height:80px;
filter:progid:DXImageTransform.Microsoft.AlphaImageLo ader(src='logo.png'); }
DIV#top-bottom img{width:250px;height:80px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); }
</style>
<![endif]-->
</HEAD>
<HTML>
<div id="top-bottom">
<img src="logo.png" border="0" width="250" height="80" alt="logo" />
</div>
</HTML>
Un altro metodo potrebbe essere quello dell'utilizzo di un file in Javascript per rendere la trasparenza su tutte le immagini. E' comodo solo che richiede javascript abilitato sul browser dell'utente (IE sempre)
Ecco il link dove ho preso la documentazione in inglese: http://homepage.ntlworld.com/bobosola/index.htm
Ciao!
Marco
