Veröffentlicht 30. August 200421 j Hallo, ich blende einpaar Zeilen via Javascript ein und aus. Das ganze ist mit <div id="1" class="parent"> irgend ein Text </div> <div id="2" class="child"> weiterer Text </div> <div id="3" class="parent"> Text </div> <div id="4" class="child"> noch mehr text Text </div> und in JavaScript folgendem: if(ns) { document.write( "<style type='text/css'>" + ".child { position:relative; visibility:hidden; }" + ".parent { position:relative; visibility:show; }" + "</style>"); } else if(ie) { document.write( "<style type='text/css'>" + ".child { display:none; position:relative; }" + ".parent { display:block; position:relative; }" + "</style>"); } // und dann weiter unten if(ie) { if(ein) document.all(iItem+1)].style.display = "block" else document.all[(iItem+1)].style.display = "none"; } else if(ns) { if(ein) document.getElementById(layername).style.visibility="hidden"; else document.getElementById(layername).style.visibility="visible"; } Also das auf- und zuklappen funktioniert bei beiden browsern(IE 6 und Netscape 7.1) Das Problem ist die Positionierung der <div> bei Netscape. Entweder werden alle <div> so positioniert, als wären diese eingeblendet(also Aufgeklappt, mit zwischenräumen) oder sie werden zunächst Zugeklappt korrekt angezeigt, aber beim aufklappen werden dann die <div> übereinander angezeigt. Was ich gerne hätte wäre: zunächst alle Einträge Zugeklappt: -Eintrag Parent1 -Eintrag Parent2 -Eintrag Parent3 und beim aufklappten soll folglich: -Eintrag Parent1 -Eintrag Parent2 - Eintrag Child1 - Eintrag Child2 - Eintrag Child3 -Eintrag Parent3 Hoffe es ist einigermaßen verständlich
30. August 200421 j dieser teil hier: if(ein) document.all(iItem+1)].style.display = "block" else document.all[(iItem+1)].style.display = "none"; muss auf jeden fall so lauten: if(ein) document.all(iItem+1)].style.display = "" else document.all[(iItem+1)].style.display = "none"; Ob das dein Prob behebt, kann ich dir mit deiner erläuterung aber nicht sagen und warum verwendest du nicht bei allen Browsern "style.display"?
30. August 200421 j leider ist damit das prob nicht gelöst. Also das Problem ist die Positionierung der <div> beim Netscape 7.1 Ich Denke, dass das Problem bei folgendem Code liegt document.write( "<style type='text/css'>" + ".child { position:relative; visibility:hidden; }" + ".parent { position:relative; visibility:show; }" + "</style>"); wenn bei beiden (child und parent) die position = relative ist, wird es so angezeigt -Eintrag Parent1 -Eintrag Parent2 -Eintrag Parent3 Beim aufklappen des Parent2, so: -Eintrag Parent1 -Eintrag Parent2 - Eintrag Child1 - Eintrag Child2 - Eintrag Child3 -Eintrag Parent3 Wenn bei Child = Absolute und Parent = Relative, dann wird es so angezeigt: -Eintrag Parent1 -Eintrag Parent2 -Eintrag Parent3 Beim aufklappen des Parent2 wird dann Parent3 von den Child-Einträgen überdeckt Eigentlich sollte Child und Parent bei der Position = Relative korrekt sein. Der IE zeigt es richtig an, der Netspace 7.1 nicht. Ist das vielleicht ein bug?
30. August 200421 j leider hab ich nicht die möglichkeit es online zu stellen. Wenn jemand so nett ist es online zu stellen hier der komplette source: <script type="text/javascript" language="JavaScript"> <!-- Begin var ua = navigator.userAgent.toLowerCase() if(ua.indexOf("msie")>-1) { ns = false; ie = true; } else { ns = true; ie = false; } if(ns) { document.write( "<style type='text/css'>" + ".child { position:relative; visibility:hidden; }" + ".parent { position:relative; visibility:show; }" + "</style>"); } else if(ie) { document.write( "<style type='text/css'>" + ".child { display:none; position:relative; }" + ".parent { display:show; position:relative; }" + "</style>"); } function Expand(item) { if(ns) { var layername = "item"+(item+1); if(document.getElementById(layername).style.visibility == "visible") document.getElementById(layername).style.visibility="hidden"; else document.getElementById(layername).style.visibility="visible"; } if(ie) { if(document.all["item"+(item+1)].style.display == "none" || document.all["item"+(item+1)].style.display == "") document.all["item"+(item+1)].style.display = "block"; else if(document.all["item"+(item+1)].style.display == "block") document.all["item"+(item+1)].style.display = "none"; } } // End --> </script> <!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title></title> </head> <body text="#000000"> <div id="item0" class="parent"> <a href="javascript:Expand(0)"> -Eintrag Parent1</a> </div> <div id="item1" class="child"> - Eintrag Child1 </div> <div id="item2" class="parent"> <a href="javascript:Expand(2)"> -Eintrag Parent2</a> </div> <div id="item3" class="child"> - Eintrag Child1<br> - Eintrag Child2<br> - Eintrag Child3 </div> <div id="item4" class="parent"> <a href="javascript:Expand(4)"> -Eintrag Parent3</a> </div> <div id="item5" class="child"> - Eintrag Child1 </div> </body> </html>
30. August 200421 j so, hab`s hier mal online gestellt. Habs mir auf allen zwei Browsern angeschaut. Ist wirklich weiter auseinander beim Netscape
30. August 200421 j hi, also ich hab mir das ganze mit dem IE6 und dem MozillaFireFox 0.9.3 angesehen und mit beiden sieht das alles recht gut aus. Wies im NS aussieht, kann ich jetzt von hier nicht sagen! Aber auf jeden fall müsste die oben von mir Angesprochene Änderung eingepflegt werden, damit das auf/zuklappen richtig funktioniert! die JS funktion lässt sich übrigens noch optimieren: // let's find out what DOM functions we can use var vbDOMtype = ''; if (document.getElementById) { vbDOMtype = "std"; } else if (document.all) { vbDOMtype = "ie4"; } else if (document.layers) { vbDOMtype = "ns4"; } // make an array to store cached locations of objects called by fetch_object var vBobjects = new Array(); // function to emulate document.getElementById function fetch_object(idname, forcefetch) { if (forcefetch || typeof(vBobjects[idname]) == "undefined") { switch (vbDOMtype) { case "std": { vBobjects[idname] = document.getElementById(idname); } break; case "ie4": { vBobjects[idname] = document.all[idname]; } break; case "ns4": { vBobjects[idname] = document.layers[idname]; } break; } } return vBobjects[idname]; } function Expand(item) { var layername = "item"+(item+1); oLayer = fetch_object( layername); // bei allen Browsern mit display arbeiten, nicht mit visibility!! oLayerDisplay = oLayer.style.display; oLayerDisplay = oLayerDisplay == "" ? "none" : ""; } übrigens, die 2 "Hilfs-Funktionen" hab ich von hier: http://forum.fachinformatiker.de/clientscript/vbulletin_global.js
30. August 200421 j // bei allen Browsern mit display arbeiten, nicht mit visibility!! Leider kennt der Netscape display nicht, somit muss ich für Netscape visibility nehmen. Ich hab den Code den du gepostet hast übernommen. Nur jetzt functioniert das auf- und zuklappen nicht mehr. bin echt ratlos . (warum können sich nicht alle Browserhersteller auf einen Standart einigen )
30. August 200421 j Mit Mozilla 1.7.2 wirds korrekt angezeigt. Wie es aussieht hat nur der Netscape ein Problem damit. @Manitu71: mit welcher Version von Netscape hast du es getestet?
30. August 200421 j laut selfhtml wird diese eingeschaft seit version 4 von NS u. IE unterstützt: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display
30. August 200421 j JUHU :OD es funktioniert jetzt. Und zwar doch mit display. ich hatte bei der Umstellung von visibility auf display vergessen den Wert zu ändern. Aber jetzt gehts. Vielen vielen Dank
30. August 200421 j Könntest du den funktionierenden Code mal posten. suche grade für unsere DRK-Webseite son auf und zuklappendes Menü. www.drk-ov-ulm.de Ja ich weis, noch völlig unfertig. Und der Rechner steht noch daheim, an ner 1,5MB Arcor DSL-Leitung. Also bitte keinen DDOS drauf machen. Danke! Also wenn ich den Code verwenden darf, wärs klasse. Danke Gruß Enno
30. August 200421 j <script type="text/javascript" language="JavaScript"> <!-- Begin document.write( "<style type='text/css'>" + ".child { display:none; position:relative; }" + ".parent { display:show; position:relative; }" + "</style>"); function Expand(item) { if(document.all["item"+(item+1)].style.display == "none" || document.all["item"+(item+1)].style.display == "") document.all["item"+(item+1)].style.display = "block"; else if(document.all["item"+(item+1)].style.display == "block") document.all["item"+(item+1)].style.display = "none"; } // End --> </script> <!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title></title> </head> <body text="#000000"> <div id="item0" class="parent"> <a href="javascript:Expand(0)"> -Eintrag Parent1</a> </div> <div id="item1" class="child"> - Eintrag Child1 </div> <div id="item2" class="parent"> <a href="javascript:Expand(2)"> -Eintrag Parent2</a> </div> <div id="item3" class="child"> - Eintrag Child1<br> - Eintrag Child2<br> - Eintrag Child3 </div> <div id="item4" class="parent"> <a href="javascript:Expand(4)"> -Eintrag Parent3</a> </div> <div id="item5" class="child"> - Eintrag Child1 </div> </body> </html> so müsste es gehen
30. August 200421 j schau mal dein ergebniss an, wenn du deine layer auf display: block setzt!!! öffne die kästen ma ein paar mal und du wirst merken warum ich dir mehrfach geraten haben "block" durch "" zu ersetzen! Im NS wird der Platz den das Element vorher verwendet hat nicht freigegeben und so verschiebt sich deine Menu dann ständig!!
30. August 200421 j @LT bei dem Script klappt bei mir nix aus. IE nicht, und Firefox 0.9.3 nicht. ???
30. August 200421 j Mit Mozilla 1.7.2 wirds korrekt angezeigt. Wie es aussieht hat nur der Netscape ein Problem damit. @Manitu71: mit welcher Version von Netscape hast du es getestet? Mit dem 7.1er denk ich wars War auf jedenfall ne 7 davor
30. August 200421 j so, nochmal eine Aktualisierung von deinem letzten Skript gemacht und abgelegt. Also IE geht bei mir zum ausklappen im Gegensatz bei Enno. Aber NS 7.1 zeigt nullkommanull Regung
31. August 200421 j Also: daheim: WIN XP SP2 IE 6.1 (alle SPs) tut nicht - alles direkt untereinander Mozilla 1.8 a2 tut nicht - alles direkt untereinander Firefox 0.9.3 tut nicht - alles direkt untereinander Firma: Win XP SP1 IE 6.0 (alle SPs) TUT - direkt untereinander - klappt auseinander und wieder zusammen. Mozilla und Firefox wie daheim. Gruß Enno
31. August 200421 j @kills öffne die kästen ma ein paar mal und du wirst merken warum ich dir mehrfach geraten haben "block" durch "" zu ersetzen! kann ich (leider) nicht nachvollziehen wenn ich display="block" mit display="" ersetze, dann spielt netscape nicht mit. @erno könntest du das neue skript mit deinen browsern testen und das ergebnis posten? hier das aktuellste skript: (funktioniert mit IE6.0, Netscape 7.1 und Mozilla 1.7.2) <script type="text/javascript" language="JavaScript"> <!-- Begin var ua = navigator.userAgent.toLowerCase(); /* if(ua.indexOf("msie")>-1) { ns = false; ie = true; } */ if(ua.indexOf("netscape")>-1) { ns = true; ie = false; } else { ns = false; ie = true; } var isDom = false; var isDomNN = false; var isDomIE = false; var isDOM = document.getElementById?true:false; var isDomNN = document.layers?true:false; var isDomIE = document.all?true:false; document.write( "<style type='text/css'>" + ".child { display:none; position:relative; }" + ".parent { display:block; position:relative; }" + "</style>"); function Expand(item) { if (isDOM) { if(document.getElementById("item"+(item+1)).style.display == "none" || document.getElementById("item"+(item+1)).style.display == "") { document.getElementById("item"+(item+1)).style.display = "block"; } else { document.getElementById("item"+(item+1)).style.display = "none"; } } else if (isDomIE) { if(document.all["item"+(item+1)].style.display == "visible") { document.all["item"+(item+1)].style.display = "hidden"; } else { document.all["item"+(item+1)].style.display = "visible"; } } else if (isDomNN) { if(document.layers["item"+(item+1)].visibility == "visible") { document.layers["item"+(item+1)].visibility="hidden"; } else { document.layers["item"+(item+1)].visibility="visible"; } document.layers["item"+(item+1)].visibility="hidden"; } } // End --> </script> <!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title></title> </head> <body text="#000000"> <div id="item0" class="parent"> <a href="javascript:Expand(0)"> -Eintrag Parent1</a> </div> <div id="item1" class="child"> - Eintrag Child1 </div> <div id="item2" class="parent"> <a href="javascript:Expand(2)"> -Eintrag Parent2</a> </div> <div id="item3" class="child"> - Eintrag Child1<br> - Eintrag Child2<br> - Eintrag Child3 </div> <div id="item4" class="parent"> <a href="javascript:Expand(4)"> -Eintrag Parent3</a> </div> <div id="item5" class="child"> - Eintrag Child1 </div> </body> </html>
31. August 200421 j @LT also auf arbeit (WIN XP SP1) IE klappt richtig Firefox 0.9.3 klappt richtig Mozilla 1.8 a2 klappt richtig daheim kommt ca. 17.30 die antwort, wenn ich fertig bin mit arbeiten ;-) Dort dann alles auf XP SP 2 Gruß Enno
31. August 200421 j thx, gut zu wissen das es klappt (auf XP SP1). eigentlich müsste es auch auf SP2 gehen, aber ich warte lieber ab.
31. August 200421 j so dann daheim: Win XP SP2 Firefox 0.9.3 klappt Mozilla 1.8 a2 klappt IE 6.0.2900.2096 klappt, nachdem man das Ausführen aktiver Inhalt zugelassen hat. Vorher wird das Menü vollständig ausgeklappt angezeigt. Im übrigen auf allen aneren Browsern auch, die Java-Script disabled haben. Also das Menü, wird dort vollständigausgeklappt angezeigt. Gruß Enno P.S. wie siehts aus, darf ich den code für unsere DRK-Seite verwenden? Ich würde es dort in ein php-script einbauen, das der code praktisch dynamisch erzeugt wird. Wäre klasse. Danke
Archiv
Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.