Code: Alles auswählen
<script type='text/javascript'> <!--
/*********************** Spirograph-Skript Anfang *****************************/
/*** WWW.WerIstFelix.de *** Felix at Antifas dot de ***/
var anzahl = 100; //die Länge des Spirographen
var abstand1 = 5; //abstand zwischen den einzelenen punkten der seele in pixel
var radius = 20; //wie weit dich die fäden von der seele entfernen
document.write("<span id='AAA' class='wurm'></span>");
function erzeuge() //erzeugt die ausrichtbaren Grafiken
{
var a=1;
var text="";
while(a<=anzahl)
{
text +="<span id='wurmX"+a+"' style='position:absolute; top:-10px; left:-10px; color:#808080; margin:0;'>.</span>"; //die graue seele
text +="<span id='wurma"+a+"' style='position:absolute; top:-10px; left:-10px; color:#FF0000; margin:0;'><b>.</b></span>"; //der rote faden
text +="<span id='wurmb"+a+"' style='position:absolute; top:-10px; left:-10px; color:#00FF00; margin:0;'><b>.</b></span>"; //der grüne faden
text +="<span id='wurmc"+a+"' style='position:absolute; top:-10px; left:-10px; color:#0000FF; margin:0;'><b>.</b></span>"; //der blaue faden
a++;
}
document.getElementById("AAA").innerHTML = text;
laufen();
}
document.onload = setTimeout("erzeuge()",500);
var x=-10,y=-10;
function erfasse(e) //erfasst die Mauskordinaten
{
x = (e)?e.pageX:window.event.x + document.documentElement.scrollLeft;
y = (e)?e.pageY:window.event.y + document.documentElement.scrollTop;
}
document.onmousemove = erfasse;
var X=0,Y=0,winkel=0;
function neue_koordinaten(x1,y1) //richtet das letzte Objekt ganz nach vorne
{
X = abstand1 * Math.sin(Math.atan2(y-y1,x-x1));
Y = abstand1 * Math.sin(Math.atan2(x-x1,y-y1));
winkel= Math.atan2(x-x1,y-y1);
}
var b=anzahl-1;
var c=anzahl;
var d=anzahl-Math.ceil(anzahl*0.75);
var j=0;
function laufen()
{
neux=(parseFloat(document.getElementById("wurmX"+c).style.left.replace(/px/, "")));
neuy=(parseFloat(document.getElementById("wurmX"+c).style.top.replace(/px/, "")));
neue_koordinaten(neux, neuy);
document.getElementById("wurma"+b).style.top = (parseFloat(document.getElementById("wurmX"+c).style.top.replace(/px/, "")) + X + Math.sin(j)*radius) + "px";
document.getElementById("wurmb"+b).style.top = (parseFloat(document.getElementById("wurmX"+c).style.top.replace(/px/, "")) + X + Math.sin(j + Math.PI/3*2)*radius) + "px";
document.getElementById("wurmc"+b).style.top = (parseFloat(document.getElementById("wurmX"+c).style.top.replace(/px/, "")) + X + Math.sin(j + Math.PI/3*4)*radius) + "px";
document.getElementById("wurmX"+b).style.top = (parseFloat(document.getElementById("wurmX"+c).style.top.replace(/px/, "")) + X) + "px";
neue_koordinaten(neux, neuy);
document.getElementById("wurma"+b).style.left = (parseFloat(document.getElementById("wurmX"+c).style.left.replace(/px/, "")) + Y +Math.cos(j)*radius) + "px";
document.getElementById("wurmb"+b).style.left = (parseFloat(document.getElementById("wurmX"+c).style.left.replace(/px/, "")) + Y +Math.cos(j + Math.PI/3*2)*radius) + "px";
document.getElementById("wurmc"+b).style.left = (parseFloat(document.getElementById("wurmX"+c).style.left.replace(/px/, "")) + Y +Math.cos(j + Math.PI/3*4)*radius) + "px";
document.getElementById("wurmX"+b).style.left = (parseFloat(document.getElementById("wurmX"+c).style.left.replace(/px/, "")) + Y) + "px";
j+=1/6;
b--; if(b<=0) b=anzahl;
c--; if(c<=0) c=anzahl;
d--; if(d<=0) d=anzahl;
setTimeout("laufen()",10);
}
//-->
</script>