six stars around the mouse cursor
Written by 21 August 2012
Putting a beautiful style for the cursor makes your website look more beautiful, like the following code, which gives a very beautiful style to the cursor. By moving the mouse cursor, stars are created, and by stopping the cursor, the same stars are produced at the cursor location. It creates a miracle!
Code Snippet:
<!-- this script is provided by http://www.htmlfreecode.com coded by: Kerixa Inc. -->
<!-- This Script is from www.htmlfreecode.com, Coded by: Krishna Eydat-->
<!--<head>-->
<!--</head>-->
<!--<body>-->
<SCRIPT language="JavaScript">
if (document.all){
colours=new Array('00ff00','ffff00','ff0000','ff00ff','0000ff','ee00ee','8470ff','FFBD08','DE2929')
amount=colours.length;
YgetDelay=0,XgetDelay=0,Ydelay=0,Xdelay=0,step=0.2,currStep=0,my=0,mx=0;
document.write('<div id="ie" style="position:absolute;top:0;left:0;"><div style="position:relative">');
for (i=0; i < amount; i++)
document.write('<div id="iestars" style="position:absolute;top:0px;left:0px;height:50px;width:50px;font-family:Courier New;font-size:5px;color:'+colours[i]+';padding-top:20px;text-align:center">.</div>');
document.write('</div></div>');
ini=1;
gstep=1;
function iMouse(){
my=event.y;mx=event.x;
}
document.onmousemove=iMouse
function dim(){
ini-=gstep;
dt=setTimeout('dim()',10);
if (ini < 3){
clearTimeout(dt);
glow();
}
}
function glow(){
ini+=gstep;
gt=setTimeout('glow()',100);
if (ini > 15){
clearTimeout(gt);
dim();
}
}
function stars(){
ie.style.top=document.body.scrollTop;
for (i=0; i < amount; i++)
{
var layer=iestars[i].style;
layer.filter='glow(color='+colours[i]+', strength='+ini+')';
layer.top= Ydelay+100*Math.sin((5*Math.sin((currStep-15.99)/10))+i*70)*Math.sin((currStep)/10)*Math.cos((currStep+i*25)/10);
layer.left=Xdelay+180*Math.cos((5*Math.sin((currStep-15.99)/10))+i*70)*Math.sin((currStep)/10)*Math.cos((currStep+i*25)/10);
}
currStep+=step;
}
function delay(){
Ydelay = YgetDelay+=(my-YgetDelay)*1/20;
Xdelay = XgetDelay+=(mx-XgetDelay)*1/20;
stars();
setTimeout('delay()',7);
}
delay();
glow();
}
</SCRIPT>
<!--</body>-->
<!--</html>-->
<font face="Tahoma"><a target="_blank" href="http://www.htmlfreecode.com/"><span style="font-size: 8pt; text-decoration: none">HTML Free Code</span></a></font>
<a target='_blank' href='http://www.htmlfreecode.com' style='font-size: 8pt; text-decoration: none'>Html Free Codes</a>
Example:
Let's stay in touch
Get the latest and greatest javascript codes directly to your mail
TRENDING POST
VISITORS
Online Users:
12
Recent Members:
Prashanthcs11, Designer Diva, Jirgensons E, vamsi, wapmohin
Comments
Here you can leave us commments. Let us know what you think about this code tutorial!