Spotlight On Image.

Hi, This is some interesting and cool post. You can show image in black and as you move the mouse over the image the light will show the image glow and clear. I also include the screenshots for proper understanding.






Copy the style in head section on page.
<style type="text/css">
#myimage
{
  filter:light
}
</style>


And Then Copy the following section in body section,

<img id="myimage" src="Grow.jpg" />
<script type="text/javascript" language="javascript">
s = 100; // 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>