Szöveg az egér körül 2.

Egy újabb mouse trailer, ami az egered köré rajzolja a yourLogo változóban tárolt szöveget.

Paraméterlista:
yourLogo - a szöveg
logoFont - betütípus
fontSize - betüméret
logoColor - szövegszín
xRadius - x rádiusz
yRadius - y rádiusz
logoSpeed - forgási sebesség

Müködési elv:
A yourLogo-ban tárolt szöveget felbontjuk részelemeire a split elemfügvénnyel, az L-ben eltároljuk a hosszát, majd kiteszünk L darab <div>-et a képernyöre. Ha megmozdítjuk az egeret, akkor aktiválódik a Mouse() fügvény, ami eltárolja az új egérkoordinátákat, amiket az animateLogo() fügvény használ a logokör koordinátáinak kiszámításához.

Eredmény:
nézz az egeredre

Install:
Tedd a scriptet a HEAD-be.
Ha van már valami a BODY onLoad-jában, akkor kommentezd ki (//) az utolsó sorát a scriptnek,
// window.onload = animateLogo;
majd az animateLogo()-t írd hozzá az onLoad-hoz.
pl.: <body onload="akarmi(); animateLogo()">

A forráskód:

<HEAD>

<!-- Begin
if (document.all) {
//Things you can alter
yourLogo = "      /\\\\/\\\\@mO - Honlapja -      http://www.mamo.hu      ";  //Not less than 2 letters!
logoFont = "Arial";
logoColor = "#666600";
fontSize = 10;
xRadius = 120;
yRadius = 30;
logoSpeed = 0.03;
//Nothing needs altering below!
yourLogo = yourLogo.split('');
L = yourLogo.length;
TrigSplit = 360 / L;
Sz = new Array()
logoWidth = xRadius+(fontSize*4);
logoHeight = -yRadius;
ypos = 0;
xpos = 0;
step = logoSpeed;
currStep = 0;
for (i = 0; i < L; i++) {
document.write('<div id="ie" style="position:absolute;top:0px;left:0px;'
+'width:'+(fontSize*4)+'px;height:10px;font-family:'+logoFont+';font-size:12px;'
+'color:'+logoColor+';text-align:center">'+yourLogo[i]+'</div>');
}
function Mouse() {
ypos = event.y;
xpos = event.x - 5;
}
function animateLogo() {
for (i = 0; i < L; i++) {
ie[i].style.top = ypos + (logoHeight+10) * Math.sin(currStep + i * TrigSplit * Math.PI / 180);
ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180);
Sz[i] = ie[i].style.pixelTop - ypos;
if (Sz[i] < 5) Sz[i] = 5;
ie[i].style.fontSize = (Sz[i]+fontSize) / 1.7;
}
currStep -= step;
setTimeout('animateLogo()', 50);
}

document.onmousemove=Mouse;
window.onload = animateLogo;
}
//  End -->
</script>

Másold a vágólapra