Rising bubbles javascript Trailing cursor bubble script

Rising Bubbles JavaScript
Cursor Bubble Script
Trailing Cursor Bubble Script

Handy Tip: Custom cursors are the perfect website addon for webmasters that want to add a little fun to their websites.

Bookmark This Page | Click here for more Html and Javascripts

Trailing Cursor Bubble Script

Rising images from cursor

This Trailing Cursor Javascript makes images rise from your cursor and they grow as they rise.

The example on this page uses a small heart image, but you are only limited in the images you can use by your own imagination. *smiles*

Make your image transparent or use mine. Just right click on the image of your choice on the bottom of the page and save the image to your hard drive.

Copy the script in the text box and paste it into the <body> of your page.

(Homesteaders copy and paste into an "insert html" box and place anywhere on page.)

Upload the image to your server (do not link graphics to hypergurl) and change the url of the image and the image name (3rd line of script) to reflect your image and files. (Homesteaders, don't forget to put files/image.gif.)

That is all you need to change within the script.

Tip; To select all the code, click inside the text box and press you keyboards "ctrl +a". To copy, press "ctrl + c" and to paste, press "ctrl + v".

<script 
language="JavaScript"> //This script supplied by Hypergurl.com //http://www.hypergurl.com 
Image0=new Image(); Image0.src="http://www.yoursite.com/image.gif"; 
Amount=20; Ymouse=-50; Xmouse=-50; Ypos=new Array(); Xpos=new Array(); Speed=new 
Array(); rate=new Array(); grow=new Array(); Step=new Array(); Cstep=new Array(); 
nsSize=new Array(); ns=(document.layers)?1:0; WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight; 
(document.layers)?window.captureEvents(Event.MOUSEMOVE):0; function Mouse(evnt){ 
Ymouse=(document.layers)?evnt.pageY-20:event.y-20; Xmouse=(document.layers)?evnt.pageX:event.x; 
} (document.layers)?window.onMouseMove=Mouse:document.onmousemove=Mouse; for (i=0; 
i < Amount; i++){ Ypos[i]=Math.random()*WinHeight-Ymouse; Xpos[i]=Xmouse; Speed[i]=Math.random()*10+1; 
Cstep[i]=0; Step[i]=Math.random()*0.1+0.05; grow[i]=4; nsSize[i]=Math.random()*15+5; 
rate[i]=Math.random()*0.5+0.1; } if (ns){ for (i = 0; i < Amount; i++){ document.write("<LAYER 
NAME='sn"+i+"' LEFT=0 TOP=0><img src="+Image0.src+" 
name='N' width="+nsSize[i]+" height="+nsSize[i]+"></LAYER>"); 
} } else{ document.write('<div style="position:absolute;top:0px;left:0px"><div 
style="position:relative">'); for (i = 0; i < Amount; i++){ document.write('<img 
id="si" src="'+Image0.src+'" style="position:absolute;top:0px;left:0px;filter:alpha(opacity=90)">'); 
} document.write('</div></div>'); } function MouseBubbles(){ var hscrll=(document.layers)?window.pageYOffset:document.body.scrollTop; 
var wscrll=(document.layers)?window.pageXOffset:document.body.scrollLeft; for 
(i=0; i < Amount; i++){ sy = Speed[i]*Math.sin(270*Math.PI/180); sx = Speed[i]*Math.cos(Cstep[i]*5); 
Ypos[i]+=sy; Xpos[i]+=sx; if (Ypos[i] < -40){ Ypos[i]=Ymouse; Xpos[i]=Xmouse; 
Speed[i]= 6+Math.random()*3; grow[i]=4; nsSize[i]=Math.random()*15+5; } if (ns){ 
document.layers['sn'+i].left=Xpos[i]+wscrll; document.layers['sn'+i].top=Ypos[i]+hscrll; 
} else{ si[i].style.pixelLeft=Xpos[i]+wscrll; si[i].style.pixelTop=Ypos[i]+hscrll; 
si[i].style.width=grow[i]; si[i].style.height=grow[i]; } grow[i]+=rate[i]; Cstep[i]+=Step[i]; 
if (grow[i] > 24) grow[i]=25; } setTimeout('MouseBubbles()',10); } MouseBubbles(); 
//--> </script>

Hypergurl Hosting

IMPROVED PLANS
FREE Domain Name

web hosting and domain registration

NEW!
Blog for Webmasters

Website Design

Email Hypergurl

Link To Hypergurl

Site design copyright 2001-2007 © hypergurl.com