JavaScripts -> Animation -> Text Orbit
Text umkreist den Mauszeiger in einem dreidimensionalen Orbit.
Kompatibilität getestet:
Script-Code
<script type="text/javascript">
<!--
// Text Orbit v1.0 (c) 2003 Triple-M / http://www.htmlarsenal.de
// Benutzung: Script mit dem Inhalt makeorbit(); im Body-Bereich
// Usage: Script with the content makeorbit(); in the body area
var text=" HTMLARSENAL.DE"; //Der Text / the text
var spd=-10; //Geschwindigkeit, pos.:gegen UZS, neg.:im UZS / Speed, pos: CW, neg: CCW
var radius=50; //Radius des Orbit / Radius of the Orbit
var size=12; //Schriftgröße / Font Size
var addstyle="font-family:Verdana,Helvetica,sans-serif; color:#880000";
//Zus.CSS-Angaben / Additional CSS
//Bitte ab hier nichts veraendern / Please do not change anything from here on
var tdat=text.split("");
var step;
var angle=0;
function show() {
angrad=angle*Math.PI/180;
sizeb=Math.floor(size/3);
radiusb=Math.floor(radius/2);
for(i=0;i<tdat.length;i++) {
document.getElementById('orb'+i).style.left=mousex+Math.floor(radius*Math.cos(angrad+step*i))+"px";
document.getElementById('orb'+i).style.top=mousey-Math.floor(radiusb*Math.sin(angrad+step*i))+"px";
document.getElementById('orb'+i).style.fontSize=size-Math.floor(sizeb*Math.sin(angrad+step*i))+"px";
}
}
function orbit() {
angle+=spd;
while(angle>359)angle-=360;
while(angle<0)angle+=360;
show();
}
function makeorbit() {
document.writeln('<style type="text/css">\ndiv.orb { position:absolute; font-size:6px; '+addstyle+' }\n</style>');
for(var i=0;i<tdat.length;i++) {
document.writeln('<div class="orb" id="orb'+i+'">'+tdat[i]+'</div>');
}
window.setInterval("orbit()",100);
document.onmousemove=capturemaus;
step=(2*Math.PI)/tdat.length;
}
var mousex=0;
var mousey=0;
function capturemaus(nsevent) {
if(window.event) {
mousex=window.event.x;
mousey=window.event.y;
}
else {
mousex=nsevent.pageX;
mousey=nsevent.pageY;
}
show();
}
//-->
</script>
<!--
// Text Orbit v1.0 (c) 2003 Triple-M / http://www.htmlarsenal.de
// Benutzung: Script mit dem Inhalt makeorbit(); im Body-Bereich
// Usage: Script with the content makeorbit(); in the body area
var text=" HTMLARSENAL.DE"; //Der Text / the text
var spd=-10; //Geschwindigkeit, pos.:gegen UZS, neg.:im UZS / Speed, pos: CW, neg: CCW
var radius=50; //Radius des Orbit / Radius of the Orbit
var size=12; //Schriftgröße / Font Size
var addstyle="font-family:Verdana,Helvetica,sans-serif; color:#880000";
//Zus.CSS-Angaben / Additional CSS
//Bitte ab hier nichts veraendern / Please do not change anything from here on
var tdat=text.split("");
var step;
var angle=0;
function show() {
angrad=angle*Math.PI/180;
sizeb=Math.floor(size/3);
radiusb=Math.floor(radius/2);
for(i=0;i<tdat.length;i++) {
document.getElementById('orb'+i).style.left=mousex+Math.floor(radius*Math.cos(angrad+step*i))+"px";
document.getElementById('orb'+i).style.top=mousey-Math.floor(radiusb*Math.sin(angrad+step*i))+"px";
document.getElementById('orb'+i).style.fontSize=size-Math.floor(sizeb*Math.sin(angrad+step*i))+"px";
}
}
function orbit() {
angle+=spd;
while(angle>359)angle-=360;
while(angle<0)angle+=360;
show();
}
function makeorbit() {
document.writeln('<style type="text/css">\ndiv.orb { position:absolute; font-size:6px; '+addstyle+' }\n</style>');
for(var i=0;i<tdat.length;i++) {
document.writeln('<div class="orb" id="orb'+i+'">'+tdat[i]+'</div>');
}
window.setInterval("orbit()",100);
document.onmousemove=capturemaus;
step=(2*Math.PI)/tdat.length;
}
var mousex=0;
var mousey=0;
function capturemaus(nsevent) {
if(window.event) {
mousex=window.event.x;
mousey=window.event.y;
}
else {
mousex=nsevent.pageX;
mousey=nsevent.pageY;
}
show();
}
//-->
</script>