Felix Riesterer: [JavaScript/CSS] Dropdown Menu ohne Frames?

Beitrag lesen

Lieber Tobias,

Dein Code ist eine wilde Mischung aus ansatzweise sinnvollem CSS (die Klassen, HTML-Elemente sinnvoll durch <div>s gruppiert) und total veraltetem Markup (<font>-Elemente *grrr*). Das sollten wir ändern (Stichwort: Semantisches Markup).

Ich möchte folgendes vorschlagen: Eine Navigation ist eine Liste von Links, also wird sie auch als solche ausgezeichnet. Es sind keine tabellarischen Daten, daher verwendet man im Quelltext keine Tabelle (erst recht keine verschachtelte!). Siehe hierzu das SelfHTML-Kapitel zu CSS-basierten Navigationsleisten. Dass das im beschriebenen Kapitel (obwohl äußerlich irreführend) tatsächlich Dein Vorhaben direkt betrifft, magst Du auf dieser Seite im Quelltext studieren, denn auch hier wurde eine Liste (<ul>-Element) verwendet.

Wenn Du dann den Quelltext Deiner Seite entsprechend umgebaut hast, dann kann man den <li>-Elementen, die eine weitere (verschachtelte) <ul> enthalten, eine entsprechende CSS-Klasse zuweisen, die das Auf- bzw. Zuklappen realisiert. Obige Seite hat zwar nicht den besten Javascript-Code, jedoch arbeitet sie mit semantischem Markup und passenden CSS-Klassen.

Wenn Du dann im Menü auf einen Link zu einer weiteren Seite geklickt hast, dann kann ja das PHP-Script (das Du ja ohnehin verwendest) Deiner Navigations-Liste im entsprechenden <li>-Element (in welchem sich der Menü-Unterpunkt von vorhin zwangsläufig befinden muss) per passender CSS-Klasse zum Aufklappen das Menü/die Navigation entsprechend einstellen.

Klar, was ich meine? Und tue Dir selbst den Gefallen, dieses unhandliche und monströse Tabellengebilde restlos zu entsorgen!

Liebe Grüße aus Ellwangen,

Felix Riesterer.