Opacity-Effekt

Dieses Script lässt sich gut als Intro für die Startseite nutzen.

Drei Grafiken kreisen umeinander und werden dann in der Mitte vereint.
Eine Verlinkung mit einer HTTP-Adresse oder einer eMail-Adresse sind möglich.

Klicke hier, um ein Beispiel zu sehen. Es öffnet sich ein kleines Fenster.

HTML-Einbindung
   <script> // (c) 2002 xabi@i.am var STEPS = 30;// Frames var ITIMER = 80;// Speed (miliseconds) var SPINS = 1;// Animation spins var MAXRADIUS = 300;// Radius (Pixels) var MAXIMAGES = 3;// Image Number var IMAGE = 'http://www.java24.net/gif/banner_234_60.gif'; var LINK = 'mailto:webmaster@java24.net'; var iFullCircle = 2 * Math.PI; var iCenterX = 0; var iCenterY = 0; var iStep = 0; var bRunning = 1; var bIsIE = (document.all); var iRadio; function resizePage() { if (bIsIE) { iCenterX = (document.body.clientWidth-document.images["img1"].width)/2; iCenterY = (document.body.clientHeight-document.images["img1"].height)/2; if (!bRunning) { for (var iTmp=1; iTmp<=MAXIMAGES; iTmp++) { document.getElementById("div" + iTmp).style.left = iCenterX; document.getElementById("div" + iTmp).style.top = iCenterY; } } } } function slide() { if (iStep < STEPS) { iStep++; iRadio = MAXRADIUS - ((MAXRADIUS/STEPS) * iStep); iAngulo = ((iFullCircle*SPINS) / STEPS) * iStep; for (var iTmp=1; iTmp<=MAXIMAGES; iTmp++) { document.getElementById("div" + iTmp).style.left = iCenterX + iRadio * Math.cos((iFullCircle/MAXIMAGES)*iTmp + iAngulo); document.getElementById("div" + iTmp).style.top = iCenterY + iRadio * Math.sin((iFullCircle/MAXIMAGES)*iTmp + iAngulo); document.images['img' + iTmp].filters.alpha.opacity = (100/STEPS) * iStep; } setTimeout("slide()", ITIMER); } else { bRunning = 0; } } function initThis() { if (bIsIE) { iCenterX = (document.body.clientWidth-document.images["img1"].width)/2; iCenterY = (document.body.clientHeight-document.images["img1"].height)/2; for (var iTmp=1; iTmp<=MAXIMAGES; iTmp++) { document.getElementById("div" + iTmp).style.left = iCenterX + MAXRADIUS * Math.cos((iFullCircle/MAXIMAGES)*iTmp); document.getElementById("div" + iTmp).style.top = iCenterY + MAXRADIUS * Math.sin((iFullCircle/MAXIMAGES)*iTmp); document.getElementById("div" + iTmp).style.visibility = "visible"; } iRadio = MAXRADIUS; slide(); } } </script>  <script> if (bIsIE) { for (var iTmp=1; iTmp<=MAXIMAGES; iTmp++) { document.write('<div id="div' + iTmp + '" style="position:absolute; z-index:' + (100 + iTmp) + '; left: 0px; top: 0px; visibility: hidden"><a href="' + LINK + '"><img src="' + IMAGE + '" name="img' + iTmp + '" style="filter:alpha(opacity=100)" border="0"></a></div>\n'); } } else { document.write('<table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">\n'); document.write('<tr><td align="center" valign="middle">\n'); document.write('<a href="' + LINK + '"><img src="' + IMAGE + '" name="img5" border="0"></a>\n'); document.write('</td></tr>\n'); document.write('</table>\n'); } </script> <p> <a href="javascript:initThis()">Starte Script</a> <BR> </p> <p>Wenn Du dieses Script per Autostart nutzen möchtest,</p> <p>kopiere diesen Code in den <body>-Tag:</p> <dir> <b><body onload="initThis()" onresize="resizePage()"> </b> </dir>

Hier kannst Du Dir das Javascript einfach per eMail zusenden lassen.

Mail:

Name:

Abo
Wenn Du den Newsletter beziehen möchtest, klicke bitte in das Feld "Abo"