Resaltar imagen al posarnos.

[Hiruma-Sama]

Hola, se me habia ocurrido, hacer una web, en la cual habria una sección para descargar wallpapers, para cada uno, haria una imagen mas pequeña, a modo de previsualizacion, ademas se me ocurrio (por haberlo visto en alguna que otra web), que inicialmente las imagenes esten un pokito "grises" y se le mostrara el color real cuando uno se posa por arriba con el mouse.

En lo personal, puedo modificar la imagen con Photoshop y teniendo la imagen normal y la modificada, crear una imagen de substitución y me funcionaria, pero no quisiera tener que editar todas las imagenes con el PS... mas que nada por el tiempo que consumiria si fuesen muchas imagenes.

asi que ... se puede hacer con CSS... que atributos tendria que tokar para que al pasar por el mouse se opaque o oscuresca un poco la imagen ?

Saludos.

[eSOFT]

Hola,

prueba con esto en la hoja de estilos:


a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
border:0;

}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;

}

y con el class="linkopacity" a la etiqueta <a> que contiene la imagen que quieres modificar.

Ten en cuenta que no cumple los estándares, pero funcionar funciona muy bien.

Un saludo desde eSOFT

[Hiruma-Sama]

muchas gracias por la data ^^.

estoy trabajando en eso :P

[Jamati]

Yo una vez utilizé esto, pero como no cumplia con las normas, y cada vez que validaba el CSS me daba que no reconocía eso, de maniático lo saqué... pero es verdad, funciona más que bien.