Rendere opache le immagini

 Abbiamo gia visto in un altro articolo come creare un effetto opacita� e trasparenza del intero blog ( Leggi qui ) Vediamo come creare un effetto opacita� al passare del mouse o viceversa delle immagini contenute nel nostro blog ,cosa che va molto di moda ultimamente .Per vedere une demo clicca qui .

Il codice va inserito al interno del tag </head> (dietro)


<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'/>
<script type='text/javascript'>
$(document).ready(function() {
$('img').fadeTo('slow', 0.5);
$('img').hover(function() {
$(this).fadeTo('slow', 1.0);
}, function() {
$(this).fadeTo('slow', 0.5);
});
});
</script>



Per l�effetto inverso ,cioe� al passare del mouse l�immagine diventa opaca usa questo codice

con la stessa procedura :


<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'/>
<script type='text/javascript'>
$(document).ready(function() {
$('img').fadeTo('slow', 1.0);
$('img').hover(function() {
$(this).fadeTo('slow', 0.5);
}, function() {
$(this).fadeTo('slow', 1.0);
});
});
</script>



Puoi anche utilizzare questo script per velocizzare il caricamento del tuo blog .Lo script in questione rende le immagini opache e� consente una maggiore velocita� di caricamento ( leggi qui )

Related Posts