02 marzo 2010

Efecto de luz en la imagen.

Efecto muy bueno para tus imagenes.

Este código crea un tipo de luz como una linterna en el puntero del ratón.


Copia y Pega el siguiente código dentro de las etiquetas <head> y </head> en vista HTML de tu pagina web.
 
<style>
<!--#myimage{filter:light}-->
</style>

Y este otro lo pones dentro del <body>

<body bgcolor="#000000">
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center">
<img id="myimage" src="images/bola2.jpg" width="230" height="230">
<script language="JavaScript1.2">
s = 50; // the size of the spotlight
vp = 10; // the visibility percent of the picture
startx = 0; // the top position of your sportlight into the image (on start)
starty = 0; // the left position of your spotlight into the image (on start)
var IE = document.all?true:false
function moveL()
{xv = tempX; yv = tempY; myimage.filters.light.MoveLight(1,xv,yv,s,true);}
if (IE&&myimage.filters)
document.all.myimage.onmousemove = getMouseXY;
var tempX = 0
var tempY = 0
function getMouseXY(e) {tempX = event.offsetX
tempY = event.offsetY
if (tempX < 0){tempX = 0}
if (tempY < 0){tempY = 0}
if (t)
{moveL();}
return true
}
var xv = startx;
var yv = starty;
var t= true;
if (IE&&myimage.filters){
myimage.style.cursor="hand";
myimage.filters.light.addAmbient(255,255,255,vp)
myimage.filters.light.addPoint(startx,starty,s,255,255,255,255)
}
</script>

Puedes editar la linea de color rojo.
Cambiando la URL de la imagen, y tambien la altura y el ancho.

No hay comentarios: