JavaScripts -> Mauseffekte -> Elastischer Mausverfolger

<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph1">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph2">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph3">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph4">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph5">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph6">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph7">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph8">
<img style="position:absolute; left:100px; top:100px; width:10px; height:10px" src="/pics/examples/sphere.gif" alt="" id="sph9">
<script type="text/javascript">
<!--
// Elastic Sphere Tail v1.0 (c) 2003 Triple-M / http://www.htmlarsenal.de
var xfix=0; // Letzte Kugel fest in x-Richtung - last sphere fixed in x direction
var yfix=0; // Letzte Kugel fest in y-Richtung - last sphere fixed in xydirection
var lastx=100; // x-Koordinate letzte Kugel, wenn fest - x value last sphere (if fixed)
var lasty=100; // y-Koordinate letzte Kugel, wenn fest - y value last sphere (if fixed)
var gravx=0; // Gravitation in x-Richtung - gravitation for x direction
var gravy=30; // Gravitation in y-Richtung - gravitation for y direction

var inertia=1.7; // Divisor fuer Traegheit - divisor for inertia
var feedback=4; // Divisor fuer Feedback von Schwanz zu Maus - divisor for feedback from tail to mouse
var change=2; // Divisor Geschwindigkeitsaenderung - divisor speed change

var speed=50; // Geschwindigkeit - Speed

// Ab diesem Punkt bitte nichts veraendern.
// Please do not alter anything from here on

var cnt=10;

var mousex=0;
var mousey=0;
var sphx=new Array(cnt);
var sphy=new Array(cnt);
var sphmx=new Array(cnt);
var sphmy=new Array(cnt);
var sphnx=new Array(cnt);
var sphny=new Array(cnt);
var inter=0;

function capturemaus(nsevent) {
  if(window.event) {
    mousex=window.event.x;
    mousey=window.event.y;
  }
  else {
    mousex=nsevent.pageX;
    mousey=nsevent.pageY;
  }
}


function sphstart() {
  if(inter)window.clearInterval(inter);
  for(i=0;i<cnt;i++) {
    sphx[i]=mousex;
    sphmx[i]=0;
    sphy[i]=mousey;
    sphmy[i]=0;
  }
  inter=window.setInterval('sphup()',speed);
}

function sphup() {
  sphnx[0]=sphx[0]=mousex;
  sphny[0]=sphy[0]=mousey;
  for(var i=1;i<cnt;i++) {
    xf1=sphx[i-1]-sphx[i];
    if(i<(cnt-1))xf2=sphx[i+1]-sphx[i];
    else xf2=0;
    sphmx[i]=xf1+parseInt(xf2/feedback)+parseInt(sphmx[i]/inertia)+gravx;
    sphnx[i]=sphx[i]+parseInt(sphmx[i]/change);

    yf1=sphy[i-1]-sphy[i];
    if(i<(cnt-1))yf2=sphy[i+1]-sphy[i];
    else yf2=0;
    sphmy[i]=yf1+parseInt(yf2/feedback)+parseInt(sphmy[i]/inertia)+gravy;
    sphny[i]=sphy[i]+parseInt(sphmy[i]/change);
  }
  if(xfix)sphnx[cnt-1]=lastx;
  if(yfix)sphny[cnt-1]=lasty;
  for(i=1;i<sphx.length;i++) {
    sphx[i]=sphnx[i];
    sphy[i]=sphny[i];
    document.getElementById('sph'+i).style.left=sphx[i]+"px";
    document.getElementById('sph'+i).style.top=sphy[i]+"px";
  }
}

document.onmousemove=capturemaus;
sphstart();
//-->

</script>