<!-- TWO STEPS TO INSTALL : 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document --> <!-- STEP ONE: Paste this code into the HEAD of your HTML document --> <HEAD> <title>Rotating Links</title> <style> <!-- .fly { color: aqua; font-family: arial; font-size: 24px; position: absolute; visibility:hidden; z-index: 2;} .logo { font-family: arial; font-size: 72px; color: #003194; position: absolute; top: 0px; left: 130px; visibility: visible; z-index: 1;} .desc { text-align: center; font-family: arial; font-size: 12px; color: red; position: absolute; top: 220px; left: 40px; width: 400px; visibility: hidden; z-index: 0;} //--> </style> <script language = "JavaScript"> <!-- //Dieses Skript stammt von Michael Mailer´s JavaScripts //URL: http://www.webaid.de/js -- eMail: mm@webaid.de //Bitte entfernen Sie diesen Vermerk nicht ! function showObject(object) { object.visibility = VISIBLE; } function hideObject(object) { object.visibility = HIDDEN; } function slideLogo(from, to) { if (from < to) { company.top = (from += 10); setTimeout('slideLogo(' + from + ',' + to + ')', 75); } else initObjects(); } function rotateObjects() { for (var i = 0; i < pos.length; i++) { pos[i] += inc; objects[i].visibility = 'visible'; objects[i].left = (r * Math.cos(pos[i])) + xoff objects[i].top = (r * Math.sin(pos[i])) + yoff; } rotateTimer = setTimeout("rotateObjects()", 70); } function initObjects() { objects = new Array(fly1, fly2, fly3, fly4, fly5, fly6, fly7, fly8, fly9, fly10, fly11, fly12); pos = new Array(); pos[0] = 0; for (var i = 1; i < objects.length; i++) { pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objects.length)); } rotateObjects(); } var objects; var pos; var r = 160; // radius var xoff = 180; // x offset var yoff = 170; // y offset var pi = Math.PI; // get pi var inc = pi / 180; // degrees per rotation cycle (links drehen) // var inc = -(pi / 180); // degrees per rotation cycle (rechts drehen) var objects; // objects to be rotated var pos; // position for objects function rechts() { inc=pi/180; } function links() { inc=-(pi/180); } //--> </script> <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" src="../ms.js"> <!-- //--> </SCRIPT> </head> <body bgcolor="#FFFFFF" text="#000000" link="#003194" vlink="#003194"> <font face="Arial,Helvetica,MS Sans Serif"> <b>Rotating Links</b> <div id = "fly1" class = "fly"> <a href = "#" onMouseOver = "showObject(desc1)" onMouseOut = "hideObject(desc1)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 1</a><br> </div> <div id = "fly2" class = "fly"> <a href = "#" onMouseOver = "showObject(desc2)" onMouseOut = "hideObject(desc2)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 2</a><br> </div> <div id = "fly3" class = "fly"> <a href = "#" onMouseOver = "showObject(desc3)" onMouseOut = "hideObject(desc3)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 3</a><br> </div> <div id = "fly4" class = "fly"> <a href = "#" onMouseOver = "showObject(desc4)" onMouseOut = "hideObject(desc4)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 4</a><br> </div> <div id = "fly5" class = "fly"> <a href = "#" onMouseOver = "showObject(desc5)" onMouseOut = "hideObject(desc5)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 5</a><br> </div> <div id = "fly6" class = "fly"> <a href = "#" onMouseOver = "showObject(desc6)" onMouseOut = "hideObject(desc6)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 6</a><br> </div> <div id = "fly7" class = "fly"> <a href = "#" onMouseOver = "showObject(desc7)" onMouseOut = "hideObject(desc7)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 7</a><br> </div> <div id = "fly8" class = "fly"> <a href = "#" onMouseOver = "showObject(desc8)" onMouseOut = "hideObject(desc8)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 8</a><br> </div> <div id = "fly9" class = "fly"> <a href = "#" onMouseOver = "showObject(desc9)" onMouseOut = "hideObject(desc9)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 9</a><br> </div> <div id = "fly10" class = "fly"> <a href = "#" onMouseOver = "showObject(desc10)" onMouseOut = "hideObject(desc10)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0"> 10</a><br> </div> <div id = "fly11" class = "fly"> <a href = "#" onMouseOver = "showObject(desc11)" onMouseOut = "hideObject(desc11)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0">11</a><br> </div> <div id = "fly12" class = "fly"> <a href = "#" onMouseOver = "showObject(desc12)" onMouseOut = "hideObject(desc12)" class="LinkInt"><IMG NAME="dhome_l1" SRC="k2.gif" BORDER="0">12</TD> </div> <div id = "company" class = "logo">SgS</div> <div id = "desc1" class = "desc"> Beschreibung 1 </div> <div id = "desc2" class = "desc"> Beschreibung 2 </div> <div id = "desc3" class = "desc"> Beschreibung 3 </div> <div id = "desc4" class = "desc"> Beschreibung 4 </div> <div id = "desc5" class = "desc"> Beschreibung 5 </div> <div id = "desc6" class = "desc"> Beschreibung 6 </div> <div id = "desc7" class = "desc"> Beschreibung 7 </div> <div id = "desc8" class = "desc"> Beschreibung 8 </div> <div id = "desc9" class = "desc"> Beschreibung 9 </div> <div id = "desc10" class = "desc"> Beschreibung 10 </div> <div id = "desc11" class = "desc"> Beschreibung 11 </div> <div id = "desc12" class = "desc"> Beschreibung 12 </div> <script language = "JavaScript"> <!-- var isNS = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >= 4); var HIDDEN = (isNS) ? 'hide' : 'hidden'; var VISIBLE = (isNS) ? 'show' : 'visible'; var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var fly7 = (isNS) ? document.fly7 : document.all.fly7.style; var fly8 = (isNS) ? document.fly8 : document.all.fly8.style; var fly9 = (isNS) ? document.fly9 : document.all.fly9.style; var fly10 = (isNS) ? document.fly10 : document.all.fly10.style; var fly11 = (isNS) ? document.fly11 : document.all.fly11.style; var fly12 = (isNS) ? document.fly12 : document.all.fly12.style; var company = (isNS) ? document.company : document.all.company.style; var desc1 = (isNS) ? document.desc1 : document.all.desc1.style; var desc2 = (isNS) ? document.desc2 : document.all.desc2.style; var desc3 = (isNS) ? document.desc3 : document.all.desc3.style; var desc4 = (isNS) ? document.desc4 : document.all.desc4.style; var desc5 = (isNS) ? document.desc5 : document.all.desc5.style; var desc6 = (isNS) ? document.desc6 : document.all.desc6.style; var desc7 = (isNS) ? document.desc7 : document.all.desc7.style; var desc8 = (isNS) ? document.desc8 : document.all.desc8.style; var desc9 = (isNS) ? document.desc9 : document.all.desc9.style; var desc10 = (isNS) ? document.desc10 : document.all.desc10.style; var desc11 = (isNS) ? document.desc11 : document.all.desc11.style; var desc12 = (isNS) ? document.desc12 : document.all.desc12.style; slideLogo(50, 140); //--> </script> </font> <font face="Arial,Helvetica,MS Sans Serif"> <div id="mm" style="position:absolute; top:370px; left:40px"> <ol> <a href="javascript:links()" class="LinkInt">links drehen</a> | <a href="javascript:rechts()" class="LinkInt">rechts drehen</a> </ol>
[Download ZIP?]
1