»
EnglishFrenchVietnamese

Print - Cursor Trail - JavaScriptBank.com

Full version: jsB@nk » Pointer » Trailer » Cursor Trail
URL: https://www.javascriptbank.com/cursor-trail.html

Cursor Trail © JavaScriptBank.comAdd this classic Windows effect to your website! It renders a trailing cursor whenever the user moves his mouse, and only ONE image is used to create it (sure looks like more than that!). Enjoy this great cross browser script.

Full version: jsB@nk » Pointer » Trailer » Cursor Trail
URL: https://www.javascriptbank.com/cursor-trail.html



JavaScript
<script language="JavaScript1.2"><!--var trailLength = 8 // The length of trail (8 by default; put more for longer "tail")var path = "cursor.gif" // URL of your image// do NOT modify anything beyond this pointvar isIE = false,isNav = false,range = "all.",style = ".style",i,d = 0var topPix = ".pixelTop",leftPix = ".pixelLeft",images,storageif (document.layers) { // browser snifferisNav = true,range = "layers.",style = "",topPix = ".top",leftPix = ".left"} else if (document.all) {isIE = true}function initTrail() { // prepares the scriptimages = new Array() // prepare the image arrayfor (i = 0; i < parseInt(trailLength); i++) {images[i] = new Image()images[i].src = path}storage = new Array() // prepare the storage for the coordinatesfor (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(isIE) ? document.write('<div id="obj' + i + '" style="position: absolute; z-Index: 100; height: 0; width: 0"><img src="' + images[i].src + '"></div>') : document.write('<layer name="obj' + i + '" width="0" height="0" z-index="100"><img src="' + images[i].src + '"></layer>')}trail()}function trail() { // trailing functionfor (i = 0; i < images.length; i++) { // for every div/layereval("document." + range + "obj" + i + style + topPix + "=" + storage[d]) // the Y-coordinateeval("document." + range + "obj" + i + style + leftPix + "=" + storage[d+1]) // the X-coordinated = d+2}for (i = storage.length; i >= 2; i--) { // save the coordinate for the div/layer that's behindstorage[i] = storage[i-2]}d = 0 // reset for future usevar timer = setTimeout("trail()",10) // call recursively }function processEvent(e) { // catches and processes the mousemove event if (isIE) { // for IEstorage[0] = window.event.y+document.body.scrollTop+10storage[1] = window.event.x+document.body.scrollLeft+10} else { // for Navigatorstorage[0] = e.pageY+12storage[1] = e.pageX+12}}if (isNav) {document.captureEvents(Event.MOUSEMOVE) // Defines what events to capture for Navigator}if (isIE || isNav) { // initiates the scriptinitTrail() document.onmousemove = processEvent // start capturing}//--></script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/mouse/cursor.gif