wunderwarzenschwein: Tabellenzellen mit JS und style.display Ein-/Ausblenden

Hi,

ich habe ein Problem mit der Navigation auf http://www.uni-trier.de/uni/fb6/raum/neu/

Im linken Frame (http://www.uni-trier.de/uni/fb6/raum/neu/nav.htm) werden nach einem Klick auf 'Abteilung' und 'Studium' weitere Tabellenzeilen und Zellen mit

document.getElementsByTagName("td")[i].parentNode.style.display = 'block'; //damit wird das tr sichtbar gemacht
document.getElementsByTagName("td")[i].style.display = 'block';
// und damit das td

ein- und dann auch wieder ausgeblendet. Den ganzen JS-Code gibts hier: http://www.uni-trier.de/uni/fb6/raum/neu/res/js/nav.js

Im IE (6) funktioniert das auch problemlos. Alles klappt raus und auch wieder rein. Nur im Mozilla (1.3) gibts den komischen Effekt, das beim wieder-Einklappen ein kleiner Zwischenraum bleibt, dort wo die Zellen verschwunden sind, der mit jedem Aus- und wieder Einklappen größer wird.

Ist das ein Bug in Mozilla, oder habe ich einen Fehler im JS/CSS??

Danke im Voraus für die Hilfe

wunderwarzenschwein

  1. Hallo wunderwarzenschwein,

    Ist das ein Bug in Mozilla, oder habe ich einen Fehler im JS/CSS??

    Du stehst gerade vor einem großen Problem:

    Mozilla macht es wie so oft richtig und der IE falsch. Die display-Eigenschaft von Tabellenzeilen ist 'table-row' und von Tabellenzellen 'table-cell'. Der Mozilla ist er einzige mir bekannte Browser, der das korrekt unterstützt, wenn man es mit JavaScript kombiniert. Tabellenzellen und Tabellenzeilen sind KEINE Blockelemente, daher ist das Verhalten von Mozilla bei display = 'block' korrekt.

    Leider hast Du aber das Problem, dass wenn Du es richtig machst, (also statt 'block' 'table-row'/'table-cell' verwendest) der IE spinnt.

    Aber für Dich gibt es eine Lösung. Denn Du hast ja keine richtige Tabelle sondern nur ein paar untereinander angeordnete Blöcke. Daher kannst Du die Tabelle einfach rausschmeißen und dafür <div>s verwenden. Diese kannst Du dann mit display: block/none auf normalem Wege ausblenden.

    Viele Grüße,
    Christian

    1. Hi,

      Aber für Dich gibt es eine Lösung. Denn Du hast ja keine richtige Tabelle sondern nur ein paar untereinander angeordnete Blöcke. Daher kannst Du die Tabelle einfach rausschmeißen und dafür <div>s verwenden. Diese kannst Du dann mit display: block/none auf normalem Wege ausblenden.

      Vielen Dank für die Hilfe. Mit den DIVs funktionierts. Ich hatte auch schon überlegt, auf DIVs umzusteigen, war mir aber zuviel Aufwand, alles umzuschreiben ;-)

      Jetzt gehts auf jeden Fall.

      wunderwarzenschwein