Background trasparenti con jQuery

admin — Sun, 07 Jun 2009 06:14:18 +0000

Nota dolente i background trasparenti! Io ne so qualcosa, con IE6 è sempre una lotta continua in quanto è noto ormai a tutti che non supporta i le immagini png trasparenti. Esistono in giro differenti tecniche per risolvere questo problema, questo è uno tra i migliori in quanto riesce a rendere alcuni elementi trasparenti senza bisogno dell’utilizzo di file png.

Scarica i seguenti file e includili all’interno del tuo sito web:
http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js
http://design-forge.ro/projects/opensource/transBG.jquery.plugin.js

Inserisci il seguente codice all’interno del tag :

<script type=”text/JavaScript” src=”jquery-1.2.6.min.js”></script>
<script type=”text/JavaScript” src=”transBG.jquery.plugin.js”></script>

Decidi quale Css selettori utilizzare, jQuery utilizza i selettori Css per richiamare gli oggetti presenti all’interno della pagina (id, classi, div…)

Adatta il seguente codice a seconda delle tue necessità e incolla la parte all’interno del tag oppure in un file javascript separato.

In pratica basta utilizzare la funzione transBGdraw() per ogni elemento che si vuole rendere trasparente.

<script type="text/JavaScript">

$(document).ready(function()

{
$(”#id”).transBGdraw();
$(”#menu”).transBGdraw();
$(”#container”).transBGdraw();

// !!!IMPORTANT!!!
// if you use tagnames
// or classes, make sure
// every object affected
// has a unique id.
$(”div”).each(function()
{ $(this).transBGdraw(); });

$(”h6”).each(function()
{ $(this).transBGdraw(); });

$(”.class1”).each(function()
{ $(this).transBGdraw(); });

$(”.text”).each(function()
{ $(this).transBGdraw(); });

$(”.information”).each(function()
{ $(this).transBGdraw(); });

});

</script>

Tutorial completo

TagTagWeb » iefix

Background trasparenti con jQuery