<style><!-- input {width:100} --> </style>

<div id=rep style="position:absolute;z-index:3;width:17;height:22;top:150;left:50"><img src="cursor.gif" width="17" height="22"></div> <div id=dot style="position:absolute;z-index:3;width:5;height:5;top:40;left:160"><font color=red size=1><b>+</b></font></div> <div id=data style="position:absolute;z-index:2;width:196;height:30;top:15;left:152"></div> <div id=map style="position:absolute;z-index:1;width:200;height:150;top:15;left:150;background:aqua;border:1 solid teal"></div> <input type="button" value="Record" onclick="record()"><br><br> <input type="button" value="Stop Record" onclick="stop_record()"><br><br> <input type="button" value="Reset" onclick="reset()"><br><br> <input type="button" value="Replay" onclick="run()"> <script> var posX, posY; var path = new Array(); var index = 0; var Num = 0; var save = false; var track = false begintag = '<font face="Tahoma, Arial" size=1 color=black>' function moveTo(x,y) // Cursor picture movement { rep.style.pixelLeft=x; rep.style.pixelTop=y; } function drawTo(x,y) // Dot movement { dot.style.pixelLeft=x*200/screen.width+150; dot.style.pixelTop=y*150/screen.height+15; } function wTo(x,y) // Data showing { data.innerHTML=begintag+'['+x+','+y+']</font>'; } function savePath() // Path save, if you suppose fast mouse movements, reduce TimeOut { if((posX && posY) && save) { path[index] = posX; path[index+1] = posY; index += 2; setTimeout('savePath()',10); } } function run() //Replay the record { if(Num < (path.length-1)) { moveTo(path[Num],path[Num+1]) drawTo(path[Num],path[Num+1]) wTo(path[Num],path[Num+1]) Num += 2; setTimeout('run()',10); } else Num=0; } function cursor() { posX=event.x+document.body.scrollLeft; posY=event.y+document.body.scrollTop; } function record() { if (!track) { index = 0; save = true; savePath(); } else data.innerHTML=begintag+"A path has been recorded in memory.<br>Click 'Reset' if you wish to record new one.</font>"; } function stop_record() { save = false; index = 0; time = (path.length/2)*0.1; cValue = ""+time; value = cValue.substring(0,4); s = (cValue.substring(0) == 1 && cValue.indexOf(".") == -1)?"":"s"; data.innerHTML=begintag+"Time recorded in memory: "+value+" second"+s+" with interval 0.1s</font>"; track = true; } function reset() { rep.style.pixelLeft=50 rep.style.pixelTop=150 dot.style.pixelLeft=160; dot.style.pixelTop=40; data.innerHTML=''; posX=posY=''; path = new Array(); index = 0; Num = 0; save = false; track = false; } document.onmousemove = cursor; </script>