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