✔ Submenü - wie left und right flyout kombinieren ?

[Maik]

Versteh ich dich jetzt richtig, dass du das erste Submenü zu seinem Hauptmenüpunkt horizontal verschoben einblenden willst?

Dann wären dies die beiden existierenden Regeln in dem Stylesheet, die dir das ermöglichen:

• Moderne Browser:
  

/* Position the first sub level beneath the top level liinks */
#pmenu > li:hover > ul {left:-30px; top:16px;}

• IE6:
  

/* make the second level visible when hover on first level link and position it */
#pmenu li a:hover ul {
visibility:visible; left:-30px; top:14px; lef\t:-31px; to\p:15px;
}

Die fettmarkierten left-Werte sind derzeit im Original-Menü gesetzt. Je größer der negative left-Wert, desto weiter links wird das Submenü positioniert, wenn der Wert gen null und darüber hinaus geht, wird das Submenü in die entgegengesetzte Richtung positioniert.

Nun nimmst du mit Hilfe zweier CSS-Klassen eine Fallunterscheidung vor:

/* Position the first sub level beneath the top level liinks */
#pmenu > li:hover > ul.leftpos {left:-60px; top:16px;}
#pmenu > li:hover > ul.rightpos {left:60px; top:16px;}

/* make the second level visible when hover on first level link and position it */
#pmenu li a:hover ul.leftpos {
visibility:visible; left:-60px; top:14px; lef\t:-61px; to\p:15px;
}
#pmenu li a:hover uul.rightpos {
visibility:visible; left:60px; top:14px; lef\t:61px; to\p:15px;
}

und rufst jeweils im ersten Submenü eine der beiden Klassen auf - fertitsch ;-)

 

[W-Neuling]

Vielen dank nochmal Mike.

Ich brauchte zwar wieder mal zwei Anläufe (zweimal ""exakt"" dasselbe gemacht :suspekt: )
aber es hat dann noch geklappt. ich werde die Seite wenn sie wirklich im Netz steht
nochmal hier verlinken in alter (dann funktionsloser) und neuer Form zum Vergleich.

Jetzt wechsle ich evtl. nochmal kurz in die PHP-Ecke, denn nach hartem Kampf
mit dem System (Webserver installiert, da ich ja unbedingt offline arbeiten möchte)
konnte ich das Menü mit PHP auslagern, damit ich pro neuer Themenseite dann
nicht immer gleich sämtliche html-Seiten wegen des veränderten Menüpunkts
auch nochmal ändern muss. Selbstverständlich suspekt gibt es auch hier mal
wieder ein Problemchen.... bin aber insgesamt schon einmal sehr glücklich
mit den erzielten Ergebnissen und habe das jetzt auch mit der Kommando-
zweiteilung ein wenig durchschaut - denke ich zumindest.

Also wie gesagt nochmals vielen Dank, Du hast mir wirklich sehr geholfen.

Gruß, W-Neuling

 

[W-Neuling]

Man soll den Tag ja nicht vor dem Abend loben...

Ich habe nun wieder 2 Tage lang gebastelt und das Menü richtig schön ausgebaut,
bei jedem Link gehen 8 Submenüs auf mit vielen diveresen Unter-Untermenüs etc.

Witzigerweise klappt das jetzt plötzlich super im IE7, mit dem ich früher
so meine Probleme hatte (daher ursprünglich auch die neue Homepage)
aber im Firefox 1.5 werden die letzten Haupliks nun gerne mal unter
dem ersten bzw. erstem und zweiten Hauptlink unten rangesetzt.
bei erneutem Laden wird dann auch gerne die Verteilung variiert.

Ich dachte zuerst, dass einfach das ausgelagerte Menü zu lang wäre,
da auch ein Validator dieses Menü nicht bis zum Ende prüfen wollten.
Nun habe ich jeden Hauptlink mit seinen sämtlichen Untermenüs in
je eine ausgelagerte Datei gepackt (also insgesamt 8 Dateien)
und es läuft jetzt endlich super - nur halt im Firefox nicht,
bei immerhin identischem Code.



Nachfolgend der Link zur hochgeladenen Online-Seite:
Online-Test
Ich weiß, dass sich beim Aufklappen der ganz unten liegenden Untermenüs
(1. sub 8 Karl --> 2. sub 4 Karl --> 3. sub 4 Karl --> 4. sub 4 Karl --> letztes)
je nach Auflösung Scrollbalken auftauchen aber das ist in diesem Falle unwichtig,
weil ich lediglich möglichst weitverzweigte Menüs haben wollte, da ein Entfernen
unbenötigter Untermenülinks einfacher ist, als ein eventuelles Hinzufügen.

Nachfolgend alle Dateien der Seite im zip:
Online-Test als zip

Die 8 Dateien des Menüs im zip sind von Left 2 bis Right 7 nahezu identisch,
nur dass bei Right die Richtung des Aufklappens entgegengesetzt ist.
Left X 1 und Right X 8 sind bereits in der gewollten Endfassung.

Handelt es sich eventuell um einen Bug im Mozilla ?

Gruß, W-Neuling

 

[Maik]

Hi,

ich will dich ja nicht entmutigen, aber FF2 stellt nun ein absolut "verstümmeltes" und "verwurschteltes" Menü dar, obwohl es anfänglich in ihm keine derartigen Darstellungsfehler gab, und allmählich ist mir das auch echt eine Nummer zu hoch, was du da alles in deinem "Spielzimmer" versuchst umzusetzen.

Von der vermurksten "Usability" dieses Menüs wollen wir da erst garnicht reden.

Und einzelne Submenüs, die jeweils 115 bzw. 118KB umfassen, hab ich so auch noch nicht gesehen. :suspekt:

mfg Maik

 

[W-Neuling]

Gut, Danke für den Hinweis.

Ich hatte gedacht es wäre im Großen und ganzen ok
da der IE die Sache bei mir wie gewünscht darstellt.

Die vielen Einzeldateien ...v8.php hatte ich nur wegen der Übersichtlichkeit gemacht,
weil ich mir dachte, dass man sich so nur die Ministrukturen im Anfangs- und
im Endhauptlink anschauen muss und nur einen dieser doch extrem
verschachtelten - zugegeben trotz aller Mühe unübersichtlichen -
anderen 6 Hauptlinks dazwischen.

Ich versuche die Sache mit dem verschachteln nochmal neu und weniger komplex
und schaue, ob der Fehler dann ersichtlicher wird oder gar ausbleibt. Im Grunde
hatte ich nur genau dieses versucht: das Menü weiter zu verschachteln
nach einem Schema, dass ich zuallererst nur an einem Hauptlink
ausprobiert und dann einfach auf die anderen übertragen habe.

Ich bin also weiter dran und versuch nochmal,
die Sache etwas weniger komplex darzustellen.

Gruß, W-Neuling