hallo moejoe,
ich habe mehrere divs:
<div id="lough1" class="loughD" ..></div> <div id="lough2" class="loughD" ..></div> ...
diese möchte ich nun per schleife auf visiblility="hidden" setzen.
<html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript"> <!-- function MM_findObj(n, d) { //v4.0 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && document.getElementById) x=document.getElementById(n); return x; }
function MM_changeProp(objName,x,theProp,theValue) { //v3.0 var obj = MM_findObj(objName); if (obj && (theProp.indexOf("style.")==-1 || obj.style)) eval("obj."+theProp+"='"+theValue+"'"); } //--> </script> </head>
<body bgcolor="#FFFFFF" text="#000000">
<div id="Layer1" style="position:absolute; left:35px; top:40px; z-index:1; width: 190px"> <table width="100%" border="0" cellspacing="3" cellpadding="8"> <tr> <td bgcolor="#FFCC66" width="90" height="40">11111</td> <td width="90"> </td> <td width="90"> </td> </tr> <tr> <td bgcolor="#FFCC66" height="40">aaaaa</td> <td bgcolor="#FFCC66" bordercolor="#FFCC66">bbbbb</td> <td bgcolor="#FFCC66" bordercolor="#FFCC66">ccccc</td> </tr> <tr> <td bgcolor="#FFCC66" height="40">xxxxx</td> <td bgcolor="#FFCC66" bordercolor="#FFCC66">yyyyy</td> <td bgcolor="#FFCC66" bordercolor="#FFCC66">zzzzz</td> </tr> </table> </div> <div id="Layer2" style="position:absolute; left:35px; top:40px; width:190px; z-index:2; height: 132px"> <table width="100%" border="0" cellspacing="3" cellpadding="8"> <tr> <td width="90" height="40"> </td> <td bgcolor="#FF9933" width="90">2222</td> <td width="90"> </td> </tr> <tr> <td bgcolor="#FF9933" height="40">ddd</td> <td bgcolor="#FF9933">eee</td> <td bgcolor="#FF9933">fff</td> </tr> <tr> <td bgcolor="#FF9933" height="40">987</td> <td bgcolor="#FF9933">654</td> <td bgcolor="#FF9933">321</td> </tr> </table> </div> <div id="Layer3" style="position:absolute; left:35px; top:40px; width:190px; height:132px; z-index:3"> <table width=100%" border="0" cellspacing="3" cellpadding="8"> <tr> <td width="90" height="40"> </td> <td width="90"> </td> <td width="90" bgcolor="#CC6600">3333</td> </tr> <tr> <td bgcolor="#CC6600" height="40">gggg</td> <td bgcolor="#CC6600">hhhh</td> <td bgcolor="#CC6600">jjjj</td> </tr> <tr> <td bgcolor="#CC6600" height="40"><<<</td> <td bgcolor="#CC6600">===</td> <td bgcolor="#CC6600">>>></td> </tr> </table> </div> <div id="Layer4" style="position:absolute; left:20px; top:200px; width:486px; height:121px; z-index:4"> <table width="100%" border="0" cellspacing="3" cellpadding="8"> <tr> <td> <h3>per JavaScript<br> mehrere Ebenen gleichzeitig<br> wechseln/unsichtbar machen</h3> </td> </tr> <tr> <td><a href="javascript:;" onClick="MM_changeProp('Layer1','','style.zIndex','+3','LAYER');MM_changeProp('Layer2','','style.zIndex','+1','LAYER');MM_changeProp('Layer3','','style.zIndex','+2','LAYER')">Layer1 gelb nach oben</a></td> </tr> <tr> <td><a href="javascript:;" onClick="MM_changeProp('Layer1','','style.zIndex','+1','LAYER');MM_changeProp('Layer2','','style.zIndex','+3','LAYER');MM_changeProp('Layer3','','style.zIndex','+2','LAYER')">Layer2 blau nach oben</a></td> </tr> <tr> <td><a href="javascript:;" onClick="MM_changeProp('Layer1','','style.zIndex','+1','LAYER');MM_changeProp('Layer2','','style.zIndex','+2','LAYER');MM_changeProp('Layer3','','style.zIndex','+3','LAYER')">Layer3 rot nach oben !</a></td> </tr> <tr> <td><a href="javascript:;" onClick="MM_changeProp('Layer1','','style.zIndex','+1','LAYER');MM_changeProp('Layer2','','style.zIndex','-1','LAYER');MM_changeProp('Layer3','','style.zIndex','-2','LAYER')">Layer1 ist alleine sichtbar !</a> (Layer 2+3 sind unsichtbar)</td> </tr> <tr> <td><a href="javascript:;" onClick="MM_changeProp('Layer1','','style.zIndex','+1','LAYER');MM_changeProp('Layer2','','style.zIndex','-1','LAYER');MM_changeProp('Layer3','','style.zIndex','+2','LAYER')">Layer1+3 sind sichtbar !</a> (Layer 2 ist unsichtbar)</td> </tr> <tr> <td> <h3>BrowserTest</h3> <ul> <li>OPERA 7: korrekt</li> <li>OPERA 6: <i>macht die Layer mit '-x' <font color="#FF0000">nicht</font> unsichtbar<br> </i></li> </ul> <ul> <li>NETSCAPE 7: korrekt</li> <li>NETSCAPE 6.2: korrekt</li> <li>NETSCAPE 4.75: <i>kennt diese DHTML-Sprache nicht !</i><i><br> </i></li> </ul> <ul> <li>INTERNET EXPLORER 5.5: <i>macht die Layer mit '-x' <font color="#FF0000">nicht</font> unsichtbar</i></li> </ul> </td> </tr> <tr> <td> <h3>JavaScript - Quelltext</h3> <p>Der Term <a href="javascript:;"> markiert einen EventHandler ohne in der Statusleiste eine lange Hyroglyphen-Zeile als Link-Adresse anzuzeigen.</p> </td> </tr> <tr> <td> <p><... onClick="MM_changeProp('Layer1','','style.zIndex','+1','LAYER');... > gibt die JavaScript-Eigenschaften an: lege 'Layer1' auf '+1'. Das Pluszeichen beschreibt, dass der Layer auf die sichtbare Ebene gelegt wird, das Minuszeichen beschreibt, dass der Layer auf die unsichtbare Ebene gelegt wird.</p> <p>'+' und '-' sind hier trotz JavaScript <font color="#FF0000">keine</font> mathematischen Anweisungen zum Addieren und Subtrahieren!</p> <p>...'Layer3'...'+2' heißt somit: Lege den Layer3 sichtbar auf Ebene2.</p> <p>Die Ebene '+1' ist somit die unterste sichtbare Ebene. Die Ebene '+2' liegt darüber und kann sie folglich überdecken.</p> </td> </tr> <tr><td> <h3>Anmerkung im Layout</h3> <p>Hier wird sehr deutlich, dass die historische Formatierung mit <tags> ungenau die Tabellen layoutet. > NUR noch mit CSS gestalten! < <p>Das soll jedoch nicht unbedingt Gegenstand dieses HTML-Kodes sein ! </td><tr> </table> </div> </body> </html>
MoinMoin Klaus Hab die halbe Nacht durchgetüftelt, weil mich dieses Ebenen-Problem sehr beschäftigt und endlich hat. Die Lösung habe ich teilweise per Dreamweaver gefunden, müsste folglich gehörig aufräumen, aber immerhin: Das Verstecken/Sichtbarmachen mache ich heute noch.