|
|
| Author |
Message |
IH8Purple
Joined: 29 Feb 2004
Posts: 105
Location: Ottawa, Canada
|
 Posted: Mon Mar 01, 2004 9:41 am Post subject: Make a "spotlight" on images |
 |
|
put in this header
| Code: | <style>
<!--
#myimage{
filter:light
}
-->
</style> |
then this where you want the image
| Code: | <img id="myimage" src="theimage.jpg">
<script language="JavaScript1.2">
//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> |
end product is an image that is dark and when you mouse over, you get to see a little "spotlight" on where the mouse is
_________________
To Hell With Purple HQ (under constuction)
Cool webmaster forum |
|
| Back to top |
|
 |
sam
Banned
Joined: 01 Mar 2004
Posts: 51
Location: IL
|
| Posted: Mon Mar 01, 2004 1:19 pm Post subject: |
|
|
WOW
_________________
 |
|
| Back to top |
|
|
macabist
Banned
Joined: 01 Mar 2004
Posts: 35
|
| Posted: Mon Mar 01, 2004 2:01 pm Post subject: |
|
|
| thx! |
|
| Back to top |
|
|
jalinds
Joined: 02 Mar 2004
Posts: 36
|
| Posted: Tue Mar 02, 2004 9:17 am Post subject: |
|
|
| WOW! That's really cool!!! Anyone has example for that code?? I wan't to see it working. |
|
| Back to top |
|
|
i03m
Joined: 02 Mar 2004
Posts: 6
|
| Posted: Tue Mar 02, 2004 10:13 am Post subject: |
|
|
Thank you very much. It's very coooooooool  |
|
| Back to top |
|
|
asiammyself
Joined: 02 Mar 2004
Posts: 5
|
| Posted: Tue Mar 02, 2004 11:53 am Post subject: |
|
|
| wow cool! |
|
| Back to top |
|
|
|
FAQ
Search
Memberlist
Usergroups
Register
Profile
Log in to check your private messages
Log in
