Cambiar imagen gris a normal

[xaxoxaxin]

Hola,

Tengo una imagen a color, y lo que quiero es que salga en blanco y negro y cuando pase el mouse por encima salga en color.

He mirado por muchas webs y no lo encuentro, lo que si he encontrado es esto:

Este escript lo que hace es que el boton sale con 50% menos de opacidad y cuando el mouse pasa por encima de el este vuleve a su estado normal, y cuando el mouse se va se desvanece un poco.

Código:

<!-- SCRIPT BOTONES QUE SE DESVANECEN  -->
<script language="JavaScript1.2">
function high(which2)
{
theobject=which2;
highlighting=setInterval("highlightit(theobject)",50);
	
}
function low(which2)
{
clearInterval(highlighting);
which2.filters.alpha.opacity=50;
}
function highlightit(cur2)
{
if(cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=5
else if(window.highlighting)
clearInterval(highlighting)
}
</script>
<!-- SCRIPT BOTONES QUE SE DESVANECEN  -->

Formato botones:
<img src="bot_pixels_on.png"  border="0"  id="im" onmouseover="high(this)" onmouseout="low(this)" width="123" height="24">

A continuacion esta el codigo que hace que un boton salga en gris y cuando pases el mouse por encima se vuelva a stado normal(por estado normal me refiero a la imagen grabada en el .png.

Código:

<style>
img
{
filter:gray()
}
</style>

<script type="text/javascript">
function color()
{
myImage.style.filter=false
}

function gray()
{
myImage.style.filter="gray()"
}

</script>

Y a continuacion el codigo del boton:

Código:

<img id="myImage" border="0" src="bot_pixels_on.png" onmouseover="color()" onmouseout="gray()"  />

-------------------------------------------------------------------

Como veis tengo el codigo que desvanece y el de color gris. La pregunta es si habria alguna manera de combinarlos o de si alguien tiene a mano el codigo que ando buscando.

Lo que quiero es eso que el boton este en color grisaceo con 50% de opacidad y cuando el mouse pase por encima recupere su opacidad natural y su color de la misma forma que en el script.

He buscado por el foro y no he encontrado nada que se le parezca, y por google y tal he encontrado esto que veis.

Saludos y gracias!

[caricatos]

Hola:

Los filtros solo funcionan con explorer, así que te recomiendo que no te acostumbres a usarlos, salvo en los casos que existan implementaciones estándares... , como en el caso de la opacidad.

Saludos

[xaxoxaxin]

Si es lo que me acaban de decir, que solo sirve para IE y comprobado.

Me han dicho que lo haga en CSS pero ni idea, asi que bueno sigo buscando a ver.

Saludos y gracias!

[caricatos]

Hola:

Con css no sé como hacerlo, pero con javascript y un par de imágenes puedes implementar un rollover con un par de imágenes... color.png y gris.png...

<img src="gris.png" onmouseover="this.src = 'color.png'" onmouseout="this.src = 'gris.png'" />

Saludos

[xaxoxaxin]

Gracias es lo que estaba mirando ahora, he encontrado varios efectos de fade, y estoy mirando como funcionan y al ver eso del mouse pues es lo qeu quiero probar, lo que no sabia era el codigo exacto asi que probare el tuyo y hare pruebas a ver que sale :)

Saludos y gracias!