Random Image Splash Tracker: New DHTML Animation

Random Image Splash Tracker
Splash Tracker is a stunning little DHTML animation you have never seen before. The random-image-engine creates a loooooooooong funny cursor trail out of a set of images. Add as many images as you like. Easy configuration and installation. Cross-browser.

TEST THE RANDOM IMAGE SPLASH TRACKER SCRIPT
Wait until this page has been loaded. Then move your cursor around the web page until the Random Image Splash Tracker animation stops and all images disappear.

CONFIGURATION

Step 1
Open your web page. Copy the following code and paste it right below the <body>-tag of your web page.

// IMPORTANT:
// If you add the Splash Tracker to a script-library or script-archive
// you have to add a highly visible link to
// http://www.24fun.com on the webpage
// where this script will be featured\n
	
///////////////////////////////////////////////////////////////
// CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////////

// URLs of the splash images. Replace it with your images.
var imgurl=new Array ("greensmall.gif","redsmall.gif","yellowsmall.gif")

// maximum numbers of splash images displayed on your webpage
var max_img=100

// how long shall the images be displayed after the animation is over (seconds)
var standstill=2

// speed of animation: lower means faster
var speed=6

///////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////

var imgpreload=new Array()
for (i=0;i<=imgurl.length-1;i++) {
	imgpreload[i]=new Image()
	imgpreload[i].src=imgurl[i]
}

var isfinished=false
var range=imgurl.length
var ns4=document.layers?1:0
var ns6=document.getElementById&&!document.all?1:0 
var ie=document.all?1:0
var i_img=0
var posleft
var postop
var shownext=0
var standstill=standstill*1000

function showimages(e) {
	if (i_img<=max_img && isfinished==false) {
		if (shownext==0) {
			if (ie) {
				posleft=document.body.scrollLeft+window.event.x;
				postop=document.body.scrollTop+window.event.y;
				thisobj=eval("document.all.d"+i_img+".style")
				thisobj.visibility="visible"
				thisobj.posLeft=posleft
				thisobj.posTop=postop
			}
			if (ns6) {
				posleft=e.pageX
				postop=e.pageY
				var thisid="d"+i_img
				thisobj=document.getElementById(thisid).style
				thisobj.visibility="visible"
				thisobj.left=posleft
				thisobj.top=postop
			}
			if (ns4) {
				posleft=e.pageX
				postop=e.pageY
				thisobj=eval("document.d"+i_img)
				thisobj.visibility="visible"
				thisobj.left=posleft
				thisobj.top=postop
			}
			i_img++
			
			shownext++
		}
		else {
			shownext++
			if (shownext>speed) {shownext=0}
		}
	}
	else if (isfinished==false) {
		isfinished=true
		i_img=0
		var ti=setTimeout("clearimages()",standstill)
	}
}

function clearimages() {
	if(i_img<=max_img) {	
		if (ie) {
			thisobj=eval("document.all.d"+i_img+".style")
			thisobj.visibility="hidden"
		}
		if (ns6) {
			var thisid="d"+i_img
			thisobj=document.getElementById(thisid).style
			thisobj.visibility="hidden"
		}
		if (ns4) {
			thisobj=eval("document.d"+i_img)
			thisobj.visibility="hidden"
		}
		i_img++
		var timer=setTimeout("clearimages()",20)
	}
	else {
		clearTimeout(timer)
	}
}
	
function pageisloaded() {
	if (ns4) {document.captureEvents(Event.MOUSEMOVE);}
	document.onmousemove=showimages
}

if (ie || ns4 || ns6) {
	window.onload=pageisloaded
}

for (i=0;i<=max_img;i++) {	
	var randimg=Math.floor(range*Math.random())
	if (ie || ns6) {
		document.write("<DIV id='d"+i+"' style='position:absolute;left:0;top:0;visibility:hidden'><img src='"+imgurl[randimg]+"'></div>");
	}
	if (ns4) {
		document.write("<layer name='d"+i+"' left=0 top=0 visibility=hide><img src='"+imgurl[randimg]+"'></layer>");
	}
}

document.close()

</script>

Step 2
Go to the top of the script-code and configure the URLs and the number of your images as well as the speed of the animation.
You may save these 3 images for your instant effect

Step 3
Have fun!

Download 500 of free copy-and-paste scripts