Cambio de opacidad de imagen

antinio · #1 (**permalink**) 14/08/2009, 11:48

Que tal, quisiera lograr en un boton el efecto opaco a una imagen cuando el cursor este encima, he visto algunos tutoriales aqui pero no funcionan en todos los navegadores, alguien sabe de alguno ? gracias

Panino5001 · #2 (**permalink**) 14/08/2009, 12:16

En realidad podrías hacerlo sin javascript, pero con javascript podrías usar algo así:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

<style>

.normal{-khtml-opacity:.9999; -moz-opacity:.9999; filter:alpha(opacity=99); opacity:.9999;zoom:1;}

.traslucido{-khtml-opacity:.50; -moz-opacity:.50; filter:alpha(opacity=50); opacity:.50;zoom:1; cursor:pointer}

</style>

</head>

 
<body><img src="im.jpg" onmouseover="this.className='traslucido'" onmouseout="this.className='normal'" />

</body>

</html>

antinio · #3 (**permalink**) 14/08/2009, 14:52

Muchas gracias funciona perfecto