This article describes the JS based on the mouse moving speed background picture automatic rotation method. Share to everyone for your reference. The implementation methods are as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title>js realize fast rotation of pictures around the mouse </title>
<meta http-equiv= "Content-type" content= "text/html;charset=gb2312" >
<body>
<script language= "JavaScript" >
<!--
var images= '/favicon.ico ';
var amount=7;
var speed=1;
var RunTime = 0;
var cntr=0;
var xcntr=100;
var pulse=25;
var xpos = 0;
var Ypos = 0;
var _y;
var temp;
/*if you with an image larger or smaller than the one I ' ve used
The cursor is OFF center. Alter the 2 variables below to center it.*/
var updown=-10;
var leftright=-5;
if (document.all) {
document.write (' <div id= "Iediv" style= "position:absolute;top:0px;left:0px" > ");
document.write (' <div id= ' C ' style= ' position:relative ' > ');
for (n=0 n < amount; n++)
document.write (' ");
document.write (' </div> ');
document.write (' </div> ');
function Followmouse () {
Xpos = Document.body.scrollleft+event.x+updown;
Ypos = Document.body.scrolltop+event.y+leftright;
}
Document.onmousemove = Followmouse;
}
else if (document.layers) {
Window.captureevents (Event.mousemove);
function Xfollowmouse (evnt) {
Xpos = Evnt.pagex+updown;
Ypos = Evnt.pagey+leftright;
}
Window.onmousemove = Xfollowmouse;
for (ns=0 ns < amount; ns++)
document.write ("<layer name= ' n" +ns+ "' left= ' 0 ' top= ' 0 ' visibility= ' HIDE ' ></ Layer> ");
}
function msi () {
if (document.layers) {
for (i = 0; i < NS; i++)
{
Temp= "n" +i
Document.layers[0].visibility= ' show ';
Document.layers[0].top = Ypos+cntr*math.cos ((runtime+i*4.5)/5);
Document.layers[0].left =xpos+cntr*math.sin ((runtime+i*4.5)/5);
}
Cntr+=1;
Runtime+=speed;
Stp=settimeout (' msi () ', 10);
if (cntr>=100)
{
cntr=100;
speed=2.5;
for (i = 0; i < NS; i++)
{
Temp= "n" +i
Document.layers[temp].visibility= ' show ';
Document.layers[temp].top=ypos+cntr*math.cos ((RunTime-100) *i/90);
Document.layers[temp].left=xpos+cntr*math.sin ((RunTime-100) *i/90);
}
}
if (runtime>182)
{
speed=0.5;
for (i = 0; i < NS; i++)
{
Temp= "n" +i
Document.layers[temp].top=ypos+xcntr*math.cos (((RunTime-182) +i*4.5)/5);
Document.layers[temp].left=xpos+xcntr*math.sin (((RunTime-182) +i*4.5)/5 *math.cos ((RunTime-182)/5);
}
}
}
else if (document.all) {
for (i=0;i<iediv.all.c.all.length;i++)
{
iediv.all.c.all[0].style.visibility= ' visible ';
Iediv.all.c.all[0].style.top=ypos+cntr*math.cos ((runtime+i*4.5)/5);
Iediv.all.c.all[0].style.left=xpos+cntr*math.sin ((runtime+i*4.5)/5);
}
Cntr+=1;
Runtime+=speed;
Stp=settimeout (' msi () ', 10);
if (cntr>=100)
{
cntr=100;
speed=2.5;
for (i=0;i<iediv.all.c.all.length;i++)
{
iediv.all.c.all[i].style.visibility= ' visible ';
Iediv.all.c.all[i].style.top=ypos+cntr*math.cos ((RunTime-100) *i/90);
Iediv.all.c.all[i].style.left=xpos+cntr*math.sin ((RunTime-100) *i/90);
}
}
if (runtime>182)
{
speed=0.5;
for (i=0;i<iediv.all.c.all.length;i++)
{
Iediv.all.c.all[i].style.top=ypos+xcntr*math.cos (((RunTime-182) +i*4.5)/5);
Iediv.all.c.all[i].style.left=xpos+xcntr*math.sin (((RunTime-182) +i*4.5)/5 *math.cos ((RunTime-182)/5);
}
}
}
if (runtime>210)
{
xcntr-=10;
}
if (document.layers)
_y=-window.innerwidth-90;
else if (document.all)
_y=-document.body.clientwidth-90;
if (xcntr <= _y)
{
runtime=0;
speed=1;
cntr=0;
xcntr=100;
}
}
MSI ()
-->
</script>
<script language= "Javascript" >
<!--
function SelectAll (Thefield) {
var tempval=eval ("document.") +thefield)
Tempval.focus ()
Tempval.select ()
}
-->
</script>
</body>
I hope this article will help you with your JavaScript programming.
