Efecto desvanecer imagen

Tomado del Balcon de Jaime



Localizamos la etiqueta </head> y justo antes insertamos uno de los siguientes bloques, dependiendo de la variante escogida y la presentación deseada:

Para el efecto aparecer al pasar el cursor en todas las imágenes del blog:

<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>

Para el efecto desvanecer al pasar el cursor en todas las imágenes del blog:

<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>

Para el efecto aparecer al pasar el cursor en las imágenes escogidas:

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

Para el efecto desvanecer al pasar el cursor en las imágenes escogidas:

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

Los dos últimos códigos, al contrario que los dos primeros (que al guardar la plantilla aplicarán el efecto a todas las imágenes), se aplican de forma manual, utilizando las clases resaltadas en color rojo (respectivamente), dentro del código de la imagen:

<img class='blImagjtef' src='URL DE LA IMAGEN'/>

<img class='blImaggjtef' src='URL DE LA IMAGEN'/>

En donde dice URL DE LA IMAGEN incluiremos la dirección de la fotografía o imagen.

El truco usa jQuery por lo tanto, si hemos instalado Scriptaculous, Prototype o Mootools seguramente no pueda utilizarse.

Con esto habremos terminado la instalación de este elegante efecto.