Hace unos meses me preguntaba como se hace ese efecto de opacidad en las imágenes al pasar el cursor sobre ellas y que al mismo tiempo al de quitar el cursor se viera el mismo efecto pero desvaneciéndose.
pasa el cursor sobre esta imagen para que puedas ver un ejemplo de lo que hablo:
entonces me di a la tarea de buscarlo y lo encontré, realmente el procedimiento es bastante sencillo, y aquí se los comparto, pues solo basta con entrar en Diseño > Edición de HTML y antes de </head> pega lo siguiente:
<script src='https://sites.google.com/site/tumultitec1/tumultitec/gradualfader.js' type='text/javascript'></script>
Luego pega antes de </body> pega esto:
<script type='text/javascript'>
gradualFader.init() //activate gradual fader
</script>
El último paso es sólo agregar la clase gradualfader a la imagen, por ejemplo:
<img src="URL de la imagen" class="gradualfader" />Y eso es todo, así de simple. Si tu imagen ya tuviera otra clase, por ejemplo otro efecto como pushbutton y también quieres agregar este efecto entonces sólo deja un espacio y agrega la clase correspondiente, por ejemplo:
<img src="URL de la imagen" class="pushbutton gradualfader" />
Lo mismo si quieres el efecto en un div u otro elemento, sólo agrega class="gradualfader" dentro se su código y listo.
y esto es todo, espero te guste el efecto al igual que a mi, para finalizar te recomiendo descargar aquí el script y subirlo a tu servidor para que no se sobrecargue y pueda fallar, ok.
