Jump to content
xisto Community
Sign in to follow this  
saint

A Cool Collection Of Cursor Followers...excite Your Visitors! keep them busy

Recommended Posts

hai here is a cool collection of cursor follower scripts i put together from different sites. each of them are really exciting! bet your visitors will be highly impressed and keep coming back just to play around with it :) 1. clock that follows your mouse that popular clock. everytime you look at it...has it ever failed to amaze? the intelligence of the programmer behind it too amazes me everytime. just cant think of how he first even conceived this as possible..not to mention of creating it. hats off to the man! this will rank as one of my all time favourites. ok here's the script:



<script language="JavaScript"><!--dCol='000000';//date colour.fCol='000000';//face colour.sCol='000000';//seconds colour.mCol='000000';//minutes colour.hCol='000000';//hours colour.ClockHeight=40;ClockWidth=40;ClockFromMouseY=0;ClockFromMouseX=100;// Alter nothing below! Alignments will be lost!d=new Array("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY");m=new Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER");date=new Date();day=date.getDate();year=date.getYear();if (year < 2000) year=year+1900;TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;D=TodaysDate.split('');H='...';H=H.split('');M='....';M=M.split('');S='.....';S=S.split('');Face='1 2 3 4 5 6 7 8 9 10 11 12';font='Arial';size=1;speed=0.5;ns=(document.layers);ie=(document.all);Face=Face.split(' ');n=Face.length;a=size*10;ymouse=0;xmouse=0;scrll=0;props="<font face="+font+" size="+size+" color="+fCol+"><B>";props2="<font face="+font+" size="+size+" color="+dCol+"><B>";Split=360/n;Dsplit=360/D.length;HandHeight=ClockHeight/4.5HandWidth=ClockWidth/4.5HandY=-7;HandX=-2.5;scrll=0;step=0.06;currStep=0;y=new Array();x=new Array();Y=new Array();X=new Array();for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}if (ns){for (i=0; i < D.length; i++)document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');for (i=0; i < n; i++)document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');for (i=0; i < S.length; i++)document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>');for (i=0; i < M.length; i++)document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>');for (i=0; i < H.length; i++)document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>');}if (ie){document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">');for (i=0; i < D.length; i++)document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>');document.write('</div></div>');document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">');for (i=0; i < n; i++)document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>');document.write('</div></div>');document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">');for (i=0; i < H.length; i++)document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');document.write('</div></div>');document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">');for (i=0; i < M.length; i++)document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');document.write('</div></div>')document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">');for (i=0; i < S.length; i++)document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');document.write('</div></div>')}(ns)?window.captureEvents(Event.MOUSEMOVE):0;function Mouse(evnt){ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX;}(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;function ClockAndAssign(){time = new Date ();secs = time.getSeconds();sec = -1.57 + Math.PI * secs/30;mins = time.getMinutes();min = -1.57 + Math.PI * mins/30;hr = time.getHours();hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;if (ie){Od.style.top=window.document.body.scrollTop;Of.style.top=window.document.body.scrollTop;Oh.style.top=window.document.body.scrollTop;Om.style.top=window.document.body.scrollTop;Os.style.top=window.document.body.scrollTop;}for (i=0; i < n; i++){var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style;F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);}for (i=0; i < H.length; i++){var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style;HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);}for (i=0; i < M.length; i++){var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style;ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);}for (i=0; i < S.length; i++){var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style;SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);}for (i=0; i < D.length; i++){var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style;DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);}currStep-=step;}function Delay(){scrll=(ns)?window.pageYOffset:0;Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);for (i=1; i < D.length; i++){Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);}y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);for (i=1; i < n; i++) {y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);}ClockAndAssign();setTimeout('Delay()',40);}if (ns||ie)window.onload=Delay;// --></script>


2.eyes this will keep ur visitor occupied for long...guaranteed! these eyes keep moving along with your cursor and keeps staring at it...trust me...its absorbing! kind of even addictive i would say! download the eyes.zip file attached to use the script given below:



<!-- ONE STEP TO INSTALL EYES: 1. Copy the coding into the BODY of your HTML document --><!-- STEP ONE: Paste this code into the BODY of your HTML document --><BODY><script LANGUAGE="JavaScript1.2"><!-- Original: demigod@psxexchange.com --><!-- Web Site: psxexchange.com/ --><!-- This script and many more are available free online at --><!-- The JavaScript Source!! http://javascript.internet.com --><!-- Beginvar brOK = false, mie = false;if (document.layers || document.all) brOK = true;if (document.all) mie = true;var ex = 0, ey = 0;var ae, le, re, x0, y0, tid, realx, realy;function navMove(e) {ex = e.pageX; ey = e.pageY;moveeye()return routeEvent(e);}function mieMove() {ex = document.body.scrollLeft + event.x;ey = document.body.scrollTop + event.y;moveeye();}function moveeye() {dy = ey - y0 - 20;dx1 = ex - x0 - 20;dx2 = ex - x0 - 60;r = Math.sqrt(dx1 * dx1 + dy * dy);if (r < 20) r = 20;dx1 = dx1 * 10 / r + x0 + 10;dy1 = dy * 10 / r + y0 + 10;r = Math.sqrt(dx2 * dx2 + dy * dy);if (r < 20) r = 20;dx2 = dx2 * 10 / r + x0 + 50;ae.left = x0;ae.top = y0;le.left = dx1;le.top = dy1;re.left = dx2;re.top = dy1;}function setHandlers() {if (!mie) {y0 = document.eyeballs.top;x0 = document.eyeballs.left;ae = document.eyeballs;le = document.lefteye; re = document.righteye; window.captureEvents(Event.MOUSEMOVE);window.onMouseMove = navMove;} else {y0 = document.all.eyeballs.style.pixelTop;x0 = document.all.eyeballs.style.pixelLeft;ae = document.all.eyeballs.style;le = document.all.lefteye.style;re = document.all.righteye.style;window.document.onmousemove = mieMove;}realx = x0 + 0.1;realy = y0 + 0.1;moveall();}function moveall() {rx = realx + 40;ry = realy + 40;rx += (ex - rx) * 0.1;ry += (ey - ry) * 0.1;realx = rx - 40;realy = ry - 40;x0 = Math.round(realx);y0 = Math.round(realy);moveeye();tid = setTimeout('moveall()', 100);}function placeeyes(x, y) {if (brOK) {ex = x + 40;ey = y + 40;s = '<DIV ID ="dummy" STYLE="position:absolute; ' +'top:'+y+'; left:'+x+'; width:10; height:10;"> </DIV>';s += '<DIV ID="eyeballs" STYLE="position:absolute; ' +'top:'+y+'; left:'+x+'; width:80; height:40;"><IMG SRC=' +'"whites.gif" border=0></DIV>';s += '<DIV ID="lefteye" STYLE="position:absolute; ' + 'top:'+(y+10)+'; left:'+(x+10)+'; width:20; height:20;">' +'<IMG SRC="pupil.gif" border=0></DIV>';s += '<DIV ID="righteye" STYLE="position:absolute; ' +'top:'+(y+10)+'; left:'+(x+50)+'; width:20; height:20;">' +'<IMG SRC="pupil.gif" border=0></DIV>';document.writeln(s); }}function clearEyes() {if (tid) clearTimeout(tid);}placeeyes(200, 100);window.onload = setHandlers;window.onunload = clearEyes;// End --></script><p><center><font face="arial, helvetica" size="-2">Free JavaScripts provided<br>by <a href="http://javascriptsource.com">The JavaScript Source</a></font></center><p><!-- Script Size: 2.83 KB -->


3.elastic band trial u got to see this to believe this...seriously mind blowing! a ball on a string bounces back and forth from your cursor! very animated! you feel like playing with it non-stop! download the superball.gif attached to use the script. here's the script:



//Elastic band trail//By Elastic_Ouille_script@GHindoute.net//Thanks to MP1515 <MP1515@aramette.net> for all Mathematical model//TOS for script: dynamicdrive.com/dynamicindex13/tos.txt

//For this script and more, visit dynamicdrive.com/var/ stringcolor="black" //SPECIFY STRING COLORvar ballsrc="superball.gif" //SPECIFY URL TO BALL IMAGE///No editing required below this line//////////////////////////if (document.all&&window.print){document.write('<IMG id=Om style="LEFT: -10px; POSITION: absolute" src="'+ballsrc+'">')ddx=0;ddy=0;PX=0;PY=0;xm=0;ym=0OmW=Om.width/2;OmH=Om.height/2}function Ouille(){ x=Math.round(PX+=(ddx+=((xm-PX-ddx)*3)/100)) y=Math.round(PY+=(ddy+=((ym-PY-ddy)*3-300)/100)) Om.style.left=x-OmW Om.style.top=y-OmH elastoc.to=x+","+y //elastoc.strokecolor="RGB("+x+","+(2*y)+",0)" elastoc.strokecolor=stringcolor setTimeout("Ouille()",1) }function momouse(){ xm=window.event.x+5 ym=window.event.y+document.body.scrollTop+15 elastoc.from=xm+","+ym}if(document.all&&window.print){code="<v:line id=elastoc style='LEFT:0;POSITION:absolute;TOP:0' strokeweight='1.5pt'></v:line>"} else {code="<v:group style='LEFT:-10;WIDTH:100pt;POSITION:absolute;TOP:0;HEIGHT:100pt' coordsize='21600,21600'><v:line id=elastoc style='LEFT:0;WIDTH:100pt;POSITION:absolute;TOP:0;HEIGHT:100pt' strokeweight='1.5pt'></v:line></v:group>"}if(document.all&&window.print){document.body.insertAdjacentHTML("afterBegin",code)document.onmousemove=momouseOuille()}</SCRIPT></HEAD><BODY BGCOLOR="#FFFFFF"></BODY> </HTML>


4.mouse orbit this is fascinating! really! dots of different impressive colours orbit around your cursor like planets going around the sun.....completely fascinating. here's the script:



<!-- TWO STEPS TO INSTALL MOUSE ORBIT: 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document --><!-- STEP ONE: Paste this code into the HEAD of your HTML document --><HEAD><LAYER NAME="a0" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffffff" CLIP="0,0,1,1"></LAYER><LAYER NAME="a1" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#fff000" CLIP="0,0,1,1"></LAYER><LAYER NAME="a2" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffa000" CLIP="0,0,1,1"></LAYER><LAYER NAME="a3" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ff00ff" CLIP="0,0,1,1"></LAYER><LAYER NAME="a4" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00ff00" CLIP="0,0,1,1"></LAYER><LAYER NAME="a5" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF00FF" CLIP="0,0,1,1"></LAYER><LAYER NAME="a6" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,1,1"></LAYER><LAYER NAME="a7" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffffff" CLIP="0,0,2,2"></LAYER><LAYER NAME="a8" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#fff000" CLIP="0,0,2,2"></LAYER><LAYER NAME="a9" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffa000" CLIP="0,0,2,2"></LAYER><LAYER NAME="a10" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ff00ff" CLIP="0,0,2,2"></LAYER><LAYER NAME="a11" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00ff00" CLIP="0,0,2,2"></LAYER><LAYER NAME="a12" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#0000ff" CLIP="0,0,2,2"></LAYER><LAYER NAME="a13" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,3,3"></LAYER><div id="starsDiv" style="position:absolute;top:0px;left:0px"><div style="position:relative;width:1px;height:1px;background:#ffffff;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#fff000;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px;visibility:visible"></div><div style="position:relative;width:3px;height:3px;background:#FF0000;font-size:3px;visibility:visible"></div></div></HEAD><!-- STEP TWO: Copy this code into the BODY of your HTML document --><BODY><script LANGUAGE="JavaScript"><!-- Original: Kurt Grigg (kurt.grigg@virgin.net) --><!-- Web Site: http://freespace.virgin.net/kurt.grigg --><!-- This script and many more are available free online at --><!-- The JavaScript Source!! http://javascript.internet.com --><!-- Beginvar Clrs = new Array(6);Clrs[0] = 'ff0000';Clrs[1] = '00ff00';Clrs[2] = '000aff';Clrs[3] = 'ff00ff';Clrs[4] = 'fff000';Clrs[5] = 'fffff0';var yBase = 200;var xBase = 200;var step;var currStep = 0;var Xpos = 1;var Ypos = 1;var Xs = 200;var Ys = 400;if (document.layers) {window.captureEvents(Event.MOUSEMOVE);}if (document.all) {function MoveHandler() {Xpos = document.body.scrollLeft+event.x;Ypos = document.body.scrollTop+event.y;}document.onmousemove = MoveHandler;}else if (document.layers) {function xMoveHandler(evnt) {Xpos = evnt.pageX;Ypos = evnt.pageY;}window.onMouseMove = xMoveHandler;}function Comet() {if (document.all) {yBase = window.document.body.offsetHeight / 4;xBase = window.document.body.offsetWidth / 4;}else if (document.layers) {yBase = window.innerHeight / 4;xBase = window.innerWidth / 4;}if (document.all) {for ( i = 0; i < starsDiv.all.length; i++ ) {step = 3;starsDiv.all[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200);starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400);for (ai = 0; ai < Clrs.length; ai++) {var c=Math.round(Math.random()*[ai]);}starsDiv.all[i].style.background = Clrs[c]; }}else if (document.layers) {for ( j = 0; j < 14; j++ ) { //number of NS layers!step = 6;var templayer = "a"+j;document.layers[templayer].top = Ypos + yBase*Math.cos((currStep + j*4)/12)*Math.cos(0.7+currStep/200);document.layers[templayer].left = Xpos + xBase*Math.sin((currStep + j*3)/10)*Math.sin(8.2+currStep/400);for (aj=0; aj < Clrs.length; aj++){ var c=Math.round(Math.random()*[aj]);}document.layers[templayer].bgColor = Clrs[c]; }}currStep += step;setTimeout("Comet()", 5);}Comet();// End --></script><p><center><font face="arial, helvetica" size="-2">Free JavaScripts provided<br>by <a href="http://javascriptsource.com">The JavaScript Source</a></font></center><p><!-- Script Size: 5.33 KB -->


cheerz! saint


Share this post


Link to post
Share on other sites

bet your visitors will be highly impressed and keep coming back just to play around with it :)

Or they'll find them really annoying and not bother coming back again (that's what I'd do).

Share this post


Link to post
Share on other sites

Or they'll find them really annoying and not bother coming back again (that's what I'd do).


Agreed. Changing the user's mouse pointer is about as bad as having your website start to automaticly play music when someone vists it. Not only is it a collosal waste of space and bandwidth, but it is also very very very obnoxious. If someone wanted a different graphic for their mouse pointer they would have downloaded one so they could use it perminately.

Cheap tricks are no substitute for real content.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.