Hier finden Sie alle Zeilen des im Artikel angegebenen Codes und sparen sich so das lästige Abtippen. Um den Code zu verwenden, folgen Sie bitte der Beschreibung im Heft.
<html><head><title>Sticky Menu Bar</title> <script language=javaScript> function setVariables(){ if (navigator.appName == "Netscape") { v=".top=";h=".left=";dS="document.";sD=""; y="window.pageYOffset";x="window.pageXOffset";iW="window.innerWidth";iH="window.innerHeight" } else {h=".pixelLeft=";v=".pixelTop=";dS="";sD=".style"; y="document.body.scrollTop";x="document.body.scrollLeft";iW="document.body.clientWidth";iH="document.body.clientHeight" } xyz=500 object="logo"; checkLocationA() } movex=0,movey=0,xdiff=0,ydiff=0,ystart=0,xstart=0 function checkLocation(){ innerX=eval(iW)-135 innerY=eval(iH)-120 if (document.layers){innerY-=10;innerX-=10} yy=eval(y); xx=eval(x); ydiff=ystart-yy; xdiff=xstart-xx; if ((ydiff<(-1))||(ydiff>(1))) movey=Math.round(ydiff/10),ystart-=movey if ((xdiff<(-1))||(xdiff>(1))) movex=Math.round(xdiff/10),xstart-=movex eval(dS+object+sD+v+(ystart+innerY)); eval(dS+object+sD+h+(xstart+innerX)); setTimeout("checkLocation()",10)} function checkLocationA(){ystart=eval(y);xstart=eval(x);} function switchLogo(abc){ if (abc=="menu"){ //to stop the switch logo function eval(dS+object+sD+v+0); // just eval(dS+object+sD+h+(-200)); // slash out these lines object=abc} //at the else xyz=setTimeout("delayLogo()",2000) // beginning } function delayLogo(){ eval(dS+object+sD+v+0); // eval(dS+object+sD+h+(-200)); //and these three too object='logo' // } </script> </HEAD> <body onload="setVariables();checkLocation()" bgcolor="#eeeeee"> <CENTER>New and improved <B>Sticky Logo</B><br><br> Try your scroll bars to see the effect<br><br> The logo uses relative positioning<br><br> and the logo has a time delayed menu display<br> try mouseover the logo to see the menu </CENTER> <div id="logo" style="position:absolute; visibility:show; left:0px; top:-200px; z-index:2"> <table border="0" cellspacing="10" cellpadding="0" width=100> <tr><td bgcolor=eeeeee><CENTER><A HREF="javascript:void(0)"; onmouseover="switchLogo('menu')"> <br><br> <IMG SRC="brand.gif" border=0></A></CENTER></td> </tr></table> </div> <div id="menu" style="position:absolute; visibility:show; left:0px; top:-200px; z-index:2"> <table border="0" cellspacing="10" cellpadding="0" width=100> <tr><td bgcolor=eeeeee><CENTER><A HREF="javascript:void(0)"; onmouseover="clearTimeout(xyz)"; onmouseout="switchLogo('logo')"> Menu One</A></CENTER></td> </tr> <tr><td bgcolor=eeeeee><CENTER><A HREF="javascript:void(0)"; onmouseover="clearTimeout(xyz)"; onmouseout="switchLogo('logo')"> Menu Two</A></CENTER></td> </tr> <tr><td bgcolor=eeeeee><CENTER><A HREF="javascript:void(0)"; onmouseover="clearTimeout(xyz)"; onmouseout="switchLogo('logo')"> Menu Three</A></CENTER></td> </tr> </table> </div> <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. Part way down <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>. The End <br>. <br>. <br>. <br>. <br>. <br>. <br>. <br>.......................................................................................................................................................................................................................................