Rotierende Links

Mit diesem Javascript von Super_Mario lässt sich ein Feld erzeugen, in dem frei einstellbare Links walzenförmig rotieren.

Die Links, die Schrift, das Feld und das Rotationsverhalten können im oberen Bereich des Javascripts eingestellt werden.

Die Größen werden in Pixel angegeben und die Zeiten in Millisekunden (1s = 1000ms). Für die Rotationsrichtung gibt es die Varianten „oben“ und „unten“, die sich auf die Bewegungsrichtung der Links im Vordergrund beziehen. Funktioniert in allen Browsern, die Javascript und CSS 2.0 unterstützen.

<!-- präsentiert von kostenlose-javascripts.de --> <script type='text/javascript'> <!-- /* © Valentin Hammer Originalversion auf http://www.supermario.homepage.eu */ var Links55 = new Array(); var Beschreibungen55 = new Array(); var Zielfenster55 = new Array(); var Zaehler55 = 0; var i55 = 0; /***** HIER DIE EINSTELLUNGEN FÜR DIE ANZEIGE VORNEHMEN *****/ var Feldbreite55 = 300; var Feldhoehe55 = 200; var Schriftart55 = "Arial"; var Schriftgroesse55 = 20; var kleinste_Schriftgroesse55 = 10; var Rotationsrichtung55 = "unten"; var bewegen_um_Pixel55 = 4; var Bewegungsintervall55 = 100; /***** HIER DIE LINKS EINSTELLEN *****/ // LINK 1 Links55[i55] = "http://www.google.de"; Beschreibungen55[i55] = "Google"; Zielfenster55[i55++] = "_blank"; // LINK 2 Links55[i55] = "http://www.waluigi.homepage.eu"; Beschreibungen55[i55] = "Waluigis Homepage"; Zielfenster55[i55++] = "_blank"; // LINK 3 Links55[i55] = "http://www.affusvongorilla.homepage.eu"; Beschreibungen55[i55] = "Affus bunte Seiten"; Zielfenster55[i55++] = "_blank"; // LINK 4 Links55[i55] = "http://www.homepage.eu"; Beschreibungen55[i55] = "Homepage.eu"; Zielfenster55[i55++] = "_blank"; // WEITERE LINKS KÖNNEN NACH GLEICHEM SCHEMA EINGEBAUT WERDEN /***** AB HIER NICHTS MEHR ÄNDERN *****/ if(Rotationsrichtung55=="oben") bewegen_um_Pixel55 = -bewegen_um_Pixel55; var Rotation_HTML55 = '%3Ctable border="0" width="'+Feldbreite55+'" style="height: '+Feldhoehe55+'px; position: relative">%3Ctr>%3Ctd>'; for(var j=0;j<i55;j++) Rotation_HTML55 += '%3Cform name="Rotationsform55" style="font-family: '+Schriftart55+'; font-size: '+Schriftgroesse55+'px; text-align: center; width: '+Feldbreite55+'px; position: absolute; top: 0px; left: 0px">%3Ca target="'+(Zielfenster55[j] ? Zielfenster55[j]:'_parent')+'" href="'+Links55[j]+'">'+Beschreibungen55[j]+'%3C/a>%3C/form>'; document.write(unescape(Rotation_HTML55+'%3C/td>%3C/tr>%3C/table>')); function Animation55() { for(var j=0;j<i55;j++) { with(i55>1 ? document.Rotationsform55[j].style:document.Rotationsform55.style) { fontSize = Math.round((Schriftgroesse55+kleinste_Schriftgroesse55)/2+Math.cos((Zaehler55+j*360/i55)/180*Math.PI)*(Schriftgroesse55-kleinste_Schriftgroesse55)/2); top = (Feldhoehe55/2-Schriftgroesse55/2)+Math.sin((Zaehler55+j*360/i55)/180*Math.PI)*(Feldhoehe55-Schriftgroesse55)/2+"px"; zIndex = Feldhoehe55/2+Math.round(Math.cos((Zaehler55+j*360/i55)/180*Math.PI)*Feldhoehe55/2); } } Zaehler55 += bewegen_um_Pixel55; window.setTimeout("Animation55()",Bewegungsintervall55); } //--> </script> <br /> JavaScript von <a href="http://www.kostenlose-javascripts.de/javascripts/texteffekte/rotierende-links/" target="_blank">kostenlose-javascripts.de</a> <br /> <script type="text/javascript">Animation55();</script> <!-- präsentiert von kostenlose-javascripts.de -->