Christoph Schnauß: HELP - Warum funktioniert mein Menü nicht ?

Beitrag lesen

hallo Joern,

Deine Vorschläge habe ich nicht ignoriert und ich bin Dir wirklich Dankbar das Du mir helfen willst.

vielleicht nicht ignoriert, aber verstanden hast du sie nicht.

So, und weil dieser Thread einerseits zeigt, wieviel Geduld Kai bereits mit dir verbraucht hat und wie wenig du derzeit davon umsetzen kannst, hab ich dir deine Seite korrigiert. Ich hänge den gesamten Code unten an, was für meine Art, postings hier zu schreiben, höchst ungewöhnlich ist. Schau dir das genau an  -  der Header ist da, wo er hingehört, style- und script-Bereiche sind da, wo sie hingehören. Nebenbei ist deine Tabelle rausgeflogen, die brauchtest du ja auch nicht. Das gesamte Ding funktioniert aber ausschließlich mit dem Internet Explorer, alle anderen Browser zeigen so etwas ähnliches wie Kais Screenshots. Das hängt damit zusammen, daß im Javascript-Bereich diese Zeilen drinstehen: var n = (document.layers) ? 1:0; var ie = (document.all) ? 1:0; var browser = ((n || ie) && parseInt(navigator.appVersion)>=4) Das ist eine sogenannte "Browserweiche", und sie ist in dieser Form völlig unnütz. Bloß hab ich keine Lust mehr, das auch noch zu korrigieren.

Ich kann ja verstehen, daß dir dieses Menü gefällt. Aber du hast es eben nicht selbst geschrieben, sondern irgendwo "geborgt", und im Grunde genommen überhaupt nicht verstanden. Man könnte davon immer noch ungefähr 20 Prozent "eindampfen", aber vor allem solltest du erstmal zu verstehen versuchen, wie das Ding funktioniert.

So, also hier kommt deine korrigierte Seite (und denk dran: das Menü funktioniert nur im IE!)

Christoph S.

=========================================================

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>links</title>

<script type="text/javascript"> var stayFolded = false; var exImg = new Image(); exImg.src='dsmh.gif'; var unImg = new Image(); unImg.src='usm.gif'; var n = (document.layers) ? 1:0; var ie = (document.all) ? 1:0; var browser = ((n || ie) && parseInt(navigator.appVersion)>=4);

function makeMenu(obj,nest){         nest=(!nest) ? '':'document.'+nest+'.'         this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+obj+'.style')            this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('document');         this.height=n?this.ref.height:eval(obj+'.offsetHeight')         this.x=(n)? this.css.left:this.css.pixelLeft;this.y=(n)? this.css.top:this.css.pixelTop;         this.hideIt=b_hideIt;         this.showIt=b_showIt;         this.vis=b_vis;         this.moveIt=b_moveIt         return this }

function b_showIt(){ this.css.visibility="visible" } function b_hideIt(){ this.css.visibility="hidden" } function b_vis(){   if(this.css.visibility=="hidden" || this.css.visibility=="hide")   return true; } function b_moveIt(x,y){ this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y }

function init(){         oTop=new Array()         oTop[0]=new makeMenu('divTop1','divCont')         oTop[1]=new makeMenu('divTop2','divCont')         oTop[2]=new makeMenu('divTop3','divCont')         oTop[3]=new makeMenu('divTop4','divCont')         oTop[4]=new makeMenu('divTop5','divCont')         oTop[5]=new makeMenu('divTop6','divCont')         oSub=new Array()         oSub[0]=new makeMenu('divSub1','divCont.document.divTop1')         oSub[1]=new makeMenu('divSub2','divCont.document.divTop2')         oSub[2]=new makeMenu('divSub3','divCont.document.divTop3')         oSub[3]=new makeMenu('divSub4','divCont.document.divTop4')         oSub[4]=new makeMenu('divSub5','divCont.document.divTop5')         oSub[5]=new makeMenu('divSub6','divCont.document.divTop6')         for(i=0;i<oSub.length;i++){ oSub[i].hideIt() }         for(i=1;i<oTop.length;i++){ oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height) } } function menu(num){         if(browser){                 if(!stayFolded){                         for(i=0;i<oSub.length;i++){                                 if(i!=num){                                         oSub[i].hideIt()                                         oTop[i].ref["imgA"+i].src=unImg.src                                 }                         }                         for(i=1;i<oTop.length;i++){                                 oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)                         }                 }                 if(oSub[num].vis()){                         oSub[num].showIt()                         oTop[num].ref["imgA"+num].src=exImg.src                 }else{                         oSub[num].hideIt()                         oTop[num].ref["imgA"+num].src=unImg.src                 }                 for(i=1;i<oTop.length;i++){                         if(!oSub[i-1].vis()) oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height+oSub[i-1].height)                         else oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)                 }         } } </script>

<style type="text/css"> div.clTop {position:absolute; width:170px} div.clSub {position:absolute; left:25px; width:170px;} #divCont {position:relative; left:1px; height:200px; width:170px;} #divMain {position:absolute;}

a:link { text-decoration:none; font-weight:bold; color:#0080FF; } a:visited { text-decoration:none; font-weight:bold; color:#00A0FF; } a:hover { text-decoration:none; font-weight:bold; background-color:#FFFF00; } a:active { text-decoration:none; font-weight:bold; background-color:#0000FF; } a.clMain {font-family:Arial, Verdana, Helvetica, Helv; font-size:10pt; text-decoration:none; font-weight:bold; color:#00A0FF;} a.clSubb {font-family:Arial, Verdana, Helvetica, Helv; font-size:10pt; text-decoration:none; color:#00A0FF;}

body { margin-top:12px; margin-left:12px; background-image:url(stars2.gif); } </style>

</head>

<body onload="init()">

<div style="position: absolute; top: 60px;"> <a href="http://phelanward.bei.t-online.de/"target="_top" class="clMain">Home</a> <p> </p> <p> </p> <p> </p>

<div id="divCont">   <div id="divTop1" class="clTop"><a href="" onclick="menu(0); return false" class="clMain">     <img src="usm.gif" name="imgA0" alt="" border="0">Seti@Home</a><br>       <div id="divSub1" class="clSub">          <a href="was-ist-seti.html" target="haupt" class="clSubb">Was ist Seti?</a><br>          <a href="teleskop.html" target="haupt" class="clSubb">Das Telekop</a><br>       </div>   </div>   <div id="divTop2" class="clTop"><a href="" onclick="menu(1); return false" class="clMain">     <img src="usm.gif" name="imgA1" alt="" border="0">Seti und Ich</a><br>       <div id="divSub2" class="clSub">         <a href="system-und-ich.html" target="haupt" class="clSubb">Mein System</a><br>         <a href="ich.html" target="haupt" class="clSubb">Kontakt</a><br>      </div>   </div>   <div id="divTop3" class="clTop"><a href="" onclick="menu(2); return false" class="clMain">     <img src="usm.gif" name="imgA2" alt="" border="0">Omegafaktor</a><br>       <div id="divSub3" class="clSub">         <a href="subteam.html" target="haupt" class="clSubb">Das Team </a><br>         <a href="anleitung.html" target="haupt" class="clSubb">Seti Anleitung</a><br>       </div>   </div>   <div id="divTop4" class="clTop"><a href="" onclick="menu(3); return false" class="clMain">     <img src="usm.gif" name="imgA3" alt="" border="0">Links</a><br>       <div id="divSub4" class="clSub">         <a href="andere-seiten.html" target="haupt" class="clSubb">Links</a><br>         <a href="nix.html" target="haupt" class="clSubb">non Computer </a><br>       </div>   </div>   <div id="divTop5" class="clTop"><a href="" onclick="menu(4); return false" class="clMain">     <img src="usm.gif" name="imgA4" alt="" border="0">Sonstiges</a><br>       <div id="divSub5" class="clSub">         <a href="counter.html" target="haupt" class="clSubb">Statistik</a><br>         <a href="http://www.1-2-3-gaestebuch.de/buch.gb?benutzer=omegafaktor" target="haupt" class="clSubb">Gästebuch</a><br>       </div>   </div>   <div id="divTop6" class="clTop"><a href="" onclick="menu(5); return false" class="clMain">     <img src="usm.gif" name="imgA5" alt="" border="0">inaktiv</a><br>       <div id="divSub6" class="clSub">         <a href="nix.html" target="haupt" class="clSubb">inaktiv</a><br>         <a href="nix.html" target="haupt" class="clSubb">inaktiv</a><br>       </div>   </div> </div> </div>

<div style="position: absolute; bottom: 50px;"> <font size="-1" color="#808080">Letzte &Auml;nderung am</font><br><font color="#C0C0C0">30.06.2002</font> </div>

</body></html>