[LA-Chiller]

Hallo Leute!

Ich hab mich inzwischen etwas mit CSS angefreundet und auch einige Sachen hinbekommen! *freu*
Ein Layout zu erstellen klappt schon ganz gut!

Aber ich hab mal wieder ein Frage an diese super Community!

Ist es möglich folgendes Menü zu realisieren? Kann mir da auch evtl. jemand ein bisschen helfen das umzusetzen?

Es geht um folgendes Layout:

Es soll also ganz links das Menü mit 6 Bereichen stehen - ganz rechts soll zu jedem Punkt ein individuelles Bild angezeigt werden!
Das mittlere DIV soll dann einen kleinen Rest des rechten Bildes aufweisen!
Die Bilder hab ich schon in zwei Teile zerschnitten und das Bild für den mittleren Bereich auch schon abgeschwächt!

Aus der Navigation sollen die Untermenüs jetzt aber in dem mittleren DIV aufgehen und dort immer an den jeweils ausgewählten Punkt andocken! Das erkennt man in dem Layout nicht besonders gut aber ich hoffe ihr wisst wie ich es meine!

Vielen Dank schon mal für die Hilfe!

Grüße

LA-Chiller

[homerboomer]

JavaScript?

Was genau ist das Problem? Du hast es doch schon fast?!

Du lädst jetzt alle deine Bilder und DIVs und wenn du dann einen der Links hoverst, dann rufst du ein Skript auf, was alle DIVs außer dem mit dem aktuellen Bild versteckt?!

So quasi:

Funktion (AktuellesBild)
--> Setze alle DIVs mit Bildern außer den mit dem Index AktuellesBild als hidden
--> Div mit dem Index AktuellesBild -> visible

Oder hab ich dich falsch verstanden?

[LA-Chiller]

Es steht bisher nur ein Layout als JPG!

Das oben ist auch nur ein Beispiel (ist ein alter Entwurf unserer Homepage)
Jetzt soll ich eine Präsentation machen und die soll auf dem alten Layout basieren!

Ich schaff es aber leider nicht eine Navigation zu erstellen die der da oben ähnlich ist!

[aNtiCHrist]

Ja, das lässt sich wohl allein in CSS umsetzen, JS wird nicht nötig sein.

http://htmldog.com/articles/suckerfi.../vertical.html zeigt wie man die Unterpunkte realisieren kann, http://meyerweb.com/eric/css/edge/popups/demo2.html zeigt, wie man die verschiedenen Bilder einblenden kann.

Der Rest ist eigentlich neben der korrekten Positionierung nur noch eine gestalterische Frage. Aber wenn die Gestaltung schon vorgegeben ist, dürfte das ja kein Problem sein?

[LA-Chiller]

@ aNtiCHrist

Das Menü dass du mir da gezeigt hast ist schon ganz gut - jetzt ist es nur so dass sich ja auch der letzte Punkt mit Untermenü in dem gleiche DIV Tag öffnen muss und sich dadurch der rechte Teil dann nach oben öffnen muss!
Und dder ausgewählte Punkt soll andocken - aber bei den anderen Punkten soll noch ein Abstand bleiben!
Werde gleich nochmal ein anderes Bild posten um das besser darzustellen!

Die Gestaltung ist dann ja kein Problem - nur weiß ich nicht wie ich das mit dem Menü umsetzen soll!

Schon mal Danke!

edit:
so nun hier mal die beiden Bilder:

[aNtiCHrist]

jetzt ist es nur so dass sich ja auch der letzte Punkt mit Untermenü in dem gleiche DIV Tag öffnen muss

In einem div-Tag kann sich schon mal eh nichts öffnen, ein div-Tag sieht entweder so aus: <div ... > oder so: </div>. Du meinst möglicherweise ein div-Element, das wäre der Teil, der von den genannten Start- und Endtags umschlossen wird. Aber selbst das ist vermutlich nicht korrekt, denn in dem Menü gibt es doch gar keine div-Elemente. Vermutlich meinst du einfach nur, dass sich die Unterpunkte immer an der gleichen Position öffnen sollen.

Das ist recht einfach möglich, dazu müssen nur die Positionen absolut zu dem ul-Element und nicht zu dem li-Elternelement definiert werden. http://www.alistapart.com/articles/hybrid zeigt den schrittweisen Aufbau eines solchen Menüs, wenn auch in horizontaler Ausrichtung. Vertikal muss man da dann aber nur ein bisschen Umdenken.

Das "Andocken" ist sogar noch einfacher, dazu definierst du einfach für a:hover nur eine andere width-Angabe.

Ich befürchte übrigens, dass diese Gestaltungsvorgabe mit den Untermenüs immer an der gleichen Stelle die Navigation unnötig komplizieren. Schließlich müsste man dann bei dem untersten Punkt des Hauptmenüs im Untermenü je nach Anzahl der dortigen Punkte erst weit nach oben fahren.

[LA-Chiller]

Danke - werd gleich mal versuchen dass umzumünzen - hoffe ich kann dann nochmal fragen - denn ich bin gespannt ob ich das hinbekomme....

Vielen Dank schon mal!