A trail of cursors follow your cursor around the screen as you move the mouse. The image used here is transparent so the effect is subtle, but you could use any transparent image you want. Works in Internet Explorer and Netscape.
Step 1: Add the below code to the <body> section of your page:
<scriptlanguage="javascript"type="text/javascript"> /* Visit http://www.yaldex.com/
for full source code
and get more free JavaScript, CSS and DHTML scripts! */
<!-- Begin var
trailLength =8;// The length of trail var
path ="bluedot.gif";// URL to cursor image
var
isIE =false,
isNav =false
var i
d =0; var
topPix =".pixelTop",
leftPix =".pixelLeft",images,
storage; if(!document.all){ isNav =true topPix =".top",
leftPix =".left";
}else{ isIE =true;
} function
initTrail(){ images=newArray(); for(i
=0;
i <parseInt(trailLength);
i++){ images[i]=newImage(); images[i].src=
path;
} storage =newArray(); for(i
=0;
i <images.length*3;
i++){ storage[i]=0;
} for(i
=0;
i <images.length;
i++){// make divs for IE and layers
for Navigator document.write('<div
id="obj'+
i +'" style="position: absolute;
z-Index: 100; height: 0; width: 0"><img src="'+images[i].src+'"></div>');
} trail();
} function
trail(){ for(i
=0;
i <images.length;
i++){ eval("document.getElementById('obj"+
i +"').style"+
topPix +"="+
storage[d]); eval("document.getElementById('obj"+
i +"').style"+
leftPix +"="+
storage[d+1]); d =
d+2;
} for(i
=
storage.length;
i >=2;
i--){; storage[i]=
storage[i-2];
} d =0; clearTimeout(timer); var
timer =setTimeout("trail()",10);
} function
processEvent(e){ if(isIE){ storage[0]=window.event.y+document.body.scrollTop+10; storage[1]=window.event.x+document.body.scrollLeft+10;
}else{ storage[0]=
e.pageY+12; storage[1]=
e.pageX+12; }
} if(isNav){ document.captureEvents(Event.MOUSEMOVE);
} if(isIE
||
isNav){ initTrail(); document.onmousemove=
processEvent;
} // End --> </script>
Step 2: The script uses an image as part of its interface. You can create your own, or use the below :
(right click image, and select "Save Image As")
Upload it into the same directory as your webpage.