NeonScent

home web tutorials visitor content extra contact

Image Spotlight

Image Spotlight is an effect that you can put on your site for a cool addition. (Hover over the picture to try it:)

So first, you put this in your <head> code:

Then, you put this where you want your spotlight picture to be. Replace image with your image URL:

Lastly, you put this code UNDER your spotlight picture:

//Image spotlight effect- By Erik F (die_schlampe@hotmail.com)
//Code enhancements by Dynamicdrive.com
//Visit http://www.dynamicdrive.com for this script

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)

//////////////////////////////////////////////////////////////////
//        No need to edit below this line            //
//////////////////////////////////////////////////////////////////

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>

LINK BACK

NS

Subscribe to NS

Helping bloggers build and improve.
| RSS FEED | CONTACT |

Featured

Be featured?

Email Updates

Stats

Users online: 2

home web tutorials visitor content extra contact

Image Spotlight

NS

Featured

Email Updates

Stats

Search